jquery - 选择器 ID 和功能 : why dont work?

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