选择器ID和功能：为什么不工作？

Question

选择器ID和功能：为什么不工作？

HTML：

<input type="text" id="textUpload" > 
<input type="text" id="textUpload2" value="" /> 

JS：

$("input").mouseover(function(){ 
    alert('111'); 
}); 

$("input#textUpload").mouseover(function(){ 
    alert('222'); 
}); 

$("#textUpload").mouseover(function(){ 
    alert('333'); 
}); 

$("#textUpload").click(function(){ 
    alert('444'); 
}); 

$("#textUpload").on('click', function(event) { 
    alert('555'); 
}); 

工作只 '111' 选项。为什么？

http://jsfiddle.net/nywuctuk/rw9t1pxL/17/

Answer 1

似乎有type="text"和id="之间的性格怪异。它看起来像一个空间，但不是。删除它并用空格替换可修复您的代码。 （编辑：Chrome检查器显示它是一个 ）

第一个选择器工作的原因，我假设是因为它是唯一一个按类型选择而不是ID。因此它不受格式错误的属性影响。

 
$("#textUpload").mouseover(function(){ 
 
    //alert('111'); 
 
    $(document.body).append('<br> 111'); 
 
}); 
 

 
$("input#textUpload").mouseover(function(){ 
 
    //alert('222'); 
 
    $(document.body).append('<br> 222'); 
 
}); 
 

 
$("#textUpload").mouseover(function(){ 
 
    //alert('333'); 
 
    $(document.body).append('<br> 333'); 
 
}); 
 

 
$("#textUpload").click(function(){ 
 
    //alert('444'); 
 
    $(document.body).append('<br> 444'); 
 
}); 
 

 
$("#textUpload").on('click', function(event) { 
 
    //alert('555'); 
 
    $(document.body).append('<br> 555'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<input type="text" id="textUpload"> 
 
<input type="text" id="textUpload2" value="" />

Edited JSFiddle