2

我正在使用一个 jquery 滑块插件，当它被操作时，它会将值写入 linux 文件。

Slider 控制一个文本输入框。该框是只读的，因此它总是模糊的。我无法理解的问题是为什么 onchange 命令不起作用。如果我删除输入命令上的只读属性，我会遇到同样的问题。

我知道我的 javascript 函数有效，因为我可以更改文本输入框的值并按回车键，它会更新。但是我需要它做的是在滑块改变它时更新数字，所以我不能使用 keyup 或 keydown 命令，因为滑块控制它，而不是用户的输入。

<script type="text/javascript">

$(document).ready(function() {

    $( "#LeftRecordSlider" ).slider({

        range: "min",

        orientation: "vertical",

        value: 50,

        min: 0,

        max: 100,

        slide: function( event, ui ) {

            $( "#LeftRecordAmount" ).val( ui.value );

        }

    });

    $( "#LeftRecordAmount" ).val( $( "#LeftRecordSlider" ).slider( "value" ) );

});

</script>

<script type="text/javascript">

    function ChangeVolume(volumetype,volumelevel)
        {
            var xmlhttp;
            if (window.XMLHttpRequest)
            {//IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();
            }
            else
            {//IE6, IE5
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange=function()
            {
                if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                document.getElementById("VolumeOutput").innerHTML=xmlhttp.responseText;
                }
            }
            xmlhttp.open("GET","ChangeVolume.php?volumetype="+volumetype+"&volumelevel="+volumelevel,true);
            xmlhttp.send();
        };



</script>


<label for="LeftRecordAmount">Left Record Volume:</label>

<input type="text" onchange="ChangeVolume('LeftRecord',this.value)" id="LeftRecordAmount" style="border:0; width:3em; color:#0080ff; font-weight:bold;" readonly/>

<div id="VolumeOutput"></div>
4

2 回答 2

2

尝试显式调用事件或方法。遵循以下方法

$( "#LeftRecordSlider" ).slider({
    range: "min",
    orientation: "vertical",
    value: 50,
    min: 0,
    max: 100,
    slide: function(event, ui) {
        $("#LeftRecordAmount").val( ui.value );
    },
    stop : function(event, ui){
        eval($("#LeftRecordAmount").attr("onchange")); // first approach
        ChangeVolume('LeftRecord',ui.value) // second approach
    }

});

使用其中任何一个。

于 2012-09-04T16:39:54.267 回答
0

神圣的空白蝙蝠侠希望您的代码实际上并不喜欢您不断增加的解析时间。另外我不明白为什么你不使用 jQuery 库中包含的 Ajax 方法，为什么在它已经支持回 IE6 时重新发明轮子。另一件事 Java 和 JavaScript 是两个完全不同的东西，请不要引用它们相同的东西。至于只读文本框，为什么不直接使用 disabled 属性，它的效果会更好。这也可能是一种更好的方法。

  var control = document.getElementById("LeftRecordAmount");
  control.addEventListener("change", function(){
      //do whatever here
  }
  //vanilla javascript runs faster than jQuery you can even test with console.time() profiler and        jsperf.com
  //inline handlers are also bad here's why

http://www.onlinetools.org/articles/unobtrusivejavascript/chapter4.html

于 2012-09-04T16:58:24.160 回答