JQuery適用於Firefox，但不適用於IE

任何人都知道爲什麼下面的JQuery表達式可以在Firefox中使用，但不能在IE或Chrome中使用？JQuery適用於Firefox，但不適用於IE

$('form :hidden:last').attr('name')

警報聲明顯示在IE中表達式是未定義的。

更新：這是一些失敗的HTML。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
    <head> 
     <script type="text/javascript" src="/js/jquery-1.3.2.min.js"> 
     </script> 
     <script type="text/javascript"> 
     function addItem() { 
      var v = $('form :hidden:last').attr('name'); 
      var n = /(.*)input/.exec(v); 
      var newPrefix; 
      if (n[1].length == 0) { 
      newPrefix = '1'; 
      } else { 
      newPrefix = parseInt(n[1])+1; 
      } 
      var lastExercise = $('form tr:last select:first').attr('value'); 
      var oldElem = $('form tr:last'); 
      var newElem = oldElem.clone(true); 
      var lastHidden = $('form :hidden:last'); 
      lastHidden.val(newPrefix); 
      var pat = '=\"'+n[1]+'input'; 
      newElem.html(newElem.html().replace(new RegExp(pat, 'g'), '=\"'+newPrefix+'input')); 
      newElem.appendTo('table'); 
      $('form tr:last select:first').attr('value', lastExercise); 
      $('form :hidden:last').val(''); 
     } 
     function removeItem() { 
      var rows = $('form tr'); 
      if (rows.length > 2) { 
      rows.filter(":last").remove(); 
      $('form :hidden:last').val(''); 
      } else { 
      alert('Cannot remove any more rows'); 
      } 
     } 
     </script> 
    </head> 
    <body> 
     <form autocomplete="off" method="post" action=""> 
      <div> 
       <input type="button" onclick="addItem(); return false;" value="Add Item" /> 
       <input type="button" onclick="removeItem(); return false;" value="Remove Last Item" /> 
      </div> 
      <table> 
       <tr> 
        <th>Name</th> 
        <th>Weight</th> 
       </tr> 
       <tr> 
        <td> 
        <input type="text" name="input1" id="input1" value="" /> 
        </td> 
        <td> 
        <input type="text" name="input2" id="input2" value="" /> 
        <select name="input3" class="unitsInput"> 
         <option value="0"> 
          Pounds 
         </option> 
         <option value="1"> 
          Kilograms 
         </option> 
        </select> 
        </td> 
        <td> 
        <input type="hidden" name="input4" id="input4" value="" /> 
        </td> 
       </tr> 
      </table> 
      <div> 
       <select name="input8"> 
        <option value="0">0</option> 
        <option value="1">1</option> 
        <option value="2">2</option> 
       </select> 
      </div> 
      <div> 
       <input type="submit" name="submit" id="submit" value="Submit" /> 
      </div> 
     </form> 
    </body> 
</html>

來源

2009-06-01 Khanpo

提供一些HTML，你會得到這回答lickety分裂。 – 2009-06-01 03:19:54

在我添加的代碼中，addItem中的第一行返回undefined。 – Khanpo 2009-06-01 12:21:02

我能夠讓它在IE7中正常運行。
你的HTML看起來像什麼？

這裏是我的樣子：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<title>Untitled Document</title> 
<script type="text/javascript" src="jquery-1.3.2.min.js"></script> 
</head> 

<body> 
<form action="" method="get" name="testform"> 
<input name="bob" type="hidden" value="" /> 
<input name="steve" type="hidden" value="" /> 
<input name="william" type="hidden" value="" /></form> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     alert($('form :hidden:last').attr('name')); 
    }); 
</script> 
</body> 
</html>

來源

2009-06-01 03:22:19

你運行DOM後此查詢滿載並使用最新版本的jQuery？從Dan的上面的例子工作正常，即使在IE6對我來說。

來源

2009-06-01 03:39:24 esycat

你的JQuery包裝在一個$(document).ready(...)？

例如：

$(document).ready(function() { 
    $('form :hidden:last').attr('name') 
});

重要的是要做到這一點，以確保您的jQuery代碼開始執行之前，DOM完全加載。否則，沒有DOM（文檔）供它查詢。

來源

2009-06-01 03:42:20 Soviut

看來，IE將最後的選項元素視爲隱藏。將javascript中的所有「...：hidden ...」選擇器更改爲「... input：hidden ...」似乎解決了這個問題。

來源

2009-06-01 16:18:05 Khanpo

JQuery適用於Firefox，但不適用於IE

回答

相關問題