📄 index.php
字号:
<?php/*CREATE TABLE `speed` (`id` VARCHAR( 50 ) NOT NULL ,`speed` INT( 9 ) NOT NULL ,PRIMARY KEY ( `id` ));INSERT INTO `speed` ( `id` , `speed` ) VALUES ( 'speed_1', '0' );INSERT INTO `speed` ( `id` , `speed` ) VALUES ( 'speed_2', '0' );*/mysql_connect('localhost', 'username', 'passsword');mysql_select_db('database');// Lets setup Sajaxrequire_once('Sajax.php');sajax_init();function sajax_update($id, $value){ $id = mysql_escape_string($id); $value = mysql_escape_string($value); mysql_query("UPDATE `speed` SET `speed` = '$value' WHERE `id` = '$id';"); return 'true';}sajax_export("sajax_update");sajax_handle_client_request();// Get values from database for defaults$result = mysql_query("SELECT * FROM speed");$defaults = array();while($rw = mysql_fetch_array($result)) { $defaults[$rw['id']] = $rw['speed'];}?><!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd><html><head> <meta http-equiv="content-script-type" content="text/javascript"> <meta http-equiv="content-type" content="text/html; charset=windows-1252"> <title>Slider Bar Form Element</title> <script type="text/javascript" src="slider.js"></script> <script type="text/javascript"> <?php sajax_show_javascript(); ?> function confirm(z) { window.status = 'Sajax version updated'; } window.onload = function() { // first var el = document.getElementById("speed"); el.onDragStart = function() { in_elem = document.getElementById('speedin').className = "move2ondrag"; } el.onDrag = function() { var value_elem = document.getElementById('speed_value'); value_elem.value = Math.round(Number(this.value)); }; el.onDragStop = function() { in_elem = document.getElementById('speedin').className = "move2"; x_sajax_update('speed_1', this.value, confirm); } form_slider(el, '600'); // second var el = document.getElementById("speed2"); el.onDragStart = function() { in_elem = document.getElementById('speed2in').className = "move2ondrag"; in_elem = document.getElementById('speed2').className = "sliderondrag"; } el.onDrag = function() { var value_elem = document.getElementById('speed2_value'); value_elem.innerHTML = Math.round(Number(this.value)) + '%'; }; el.onDragStop = function() { in_elem = document.getElementById('speed2in').className = "move2"; in_elem = document.getElementById('speed2').className = "slider"; x_sajax_update('speed_2', this.value, confirm); } form_slider(el, '100'); } </script> <link rel="stylesheet" type="text/css" href="../test.css"> <link rel="stylesheet" type="text/css" href="slider.css"></head><body> <h2>DOM Javascript Slider Bar</h2> <p>Examples update a value inside a MySQL Database using the AJAX method when drag stops.</p> <label for="speed">Speed</label><br /> <input type="text" value="<?php echo $defaults['speed_1'] ?>" name="speed" id="speed" class="slider" /> <input type="text" name="speed_value" id="speed_value" size="2" value="<?php echo $defaults['speed_1'] ?>" onkeyup="newValue(this.value, 'speed')" />% <br /> <br /> <label for="speed">Speed 2</label><br /> <input type="text" name="speed2" id="speed2" class="slider" value="<?php echo $defaults['speed_2'] ?>" maxlength="3" /> <div id="speed2_value"><?php echo $defaults['speed_2'] ?>%</div> <p>View the <a href="index.phps">source php code</a> (code for <a href="Sajax.phps">Sajax.php</a>).</p> <p><a href="slider.zip">Download Files</a> | <a href="">Comments</a></p></body></html>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -