Warning: file_get_contents(/data/phpspider/zhask/data//catemap/6/google-chrome/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Jquery 在Chrome和Opera上,选择器控件上的mousedown操作会触发mousedown和mouseup事件_Jquery_Google Chrome_Events_Mouse - Fatal编程技术网

Jquery 在Chrome和Opera上,选择器控件上的mousedown操作会触发mousedown和mouseup事件

Jquery 在Chrome和Opera上,选择器控件上的mousedown操作会触发mousedown和mouseup事件,jquery,google-chrome,events,mouse,Jquery,Google Chrome,Events,Mouse,我正在开发一个基于javascript的web应用程序,它在一个选项卡上显示不同时间序列的天气数据。选项卡上显示的时间序列由id为tempVarSelect的select控件控制。对tempVarSelect控件的更改旨在执行changeTempDisplay,它在选项卡上隐藏并显示时间序列图。changeTempDisplay函数通过Jquery mouseup事件绑定到tempVarSelect中的更改: $("#tempVarSelect").mouseup(function( ){

我正在开发一个基于javascript的web应用程序,它在一个选项卡上显示不同时间序列的天气数据。选项卡上显示的时间序列由id为tempVarSelect的select控件控制。对tempVarSelect控件的更改旨在执行changeTempDisplay,它在选项卡上隐藏并显示时间序列图。changeTempDisplay函数通过Jquery mouseup事件绑定到tempVarSelect中的更改:

  $("#tempVarSelect").mouseup(function( ){ changeTempDisplay();      }); 

   function changeTempDisplay(){
     var tempVar = Number(document.getElementById("tempVarSelect").value); 
     switch (tempVar)
     {
      case 0:
        console.log(" temp_Display = " + tempVar);
        $("#tmaxGraph").show();
        $("#tmaxLabels").show();
        $("#tminGraph").hide();
        $("#tminLabels").hide(); 
        plotTMAX();
       break;
      case 1:
        console.log(" temp_Display = " + tempVar);
        $("#tmaxGraph").hide();
        $("#tmaxLabels").hide();
        $("#tminGraph").show();
        $("#tminLabels").show(); 
        plotTMIN();
       break;
      }  
   } 
这适用于Safari和Firefox,即tempVarSelect选择器上的mousedown mousemove mouseup序列会使mouseup上选择的图形类型正确显示

但在Chrome和Opera上,mousedown上的changeTempDisplay似乎会触发,导致当前的时间序列显示被重新绘制,并且mousedown上选择的tempVar编号会回显到console.log。因此,显示屏没有变化。Mousemove和mouseup会使tempVarSelect选择器指定正确的tempVar值,并在mouseup上高亮显示正确的选定变量,但由于changeTempDisplay在mousedown上触发,因此时间序列显示不会发生更改。之后,当我在tempVarSelect上向下移动鼠标时,changeTempDisplay将使用tempVar的已更改值触发,并且显示将按其应该的方式更改为新的时间序列

通过执行一个简单的测试,将mousedown和mouseup时间回显到console.log,即

var time0=新的Date.getTime

  $("#tempVarSelect").bind("mouseup",function( ){
    time = new Date().getTime() - time0;
    console.log(" tempVarSelect mouseup at t = " + time);    
    });

  $("#tempVarSelect").bind("mousedown",function( ){
    time = new Date().getTime() - time0;
    console.log(" tempVarSelect mousedown at t = " + time);    
    });
我发现实际发生的是,一个mousedown操作在Chrome中触发了mousedown mouseup序列,但在Safari和Firefox中只有mousedown。因此,在Chrome中,changeTempDisplay会触发鼠标向下的操作

我检查过类似的问题,例如,但它们似乎不适用于我所看到的


有人知道为什么会发生这种情况吗?

我找到了解决办法,删除Jquery绑定并将onchange=changeTempDisplay添加到选择器标记中。我还尝试了onclick=changeTempDisplay,但这在上面描述的Chrome中产生了相同的问题。