Jquery在firebug中工作，但不在頁面中

Question

我對JQuery編程非常陌生，需要一些幫助！

我有一個ASP.NET數據透視表，我在那個表格的單元格中有一個重要的值1,2,3或4.無論選擇哪個值，都會將單元格轉換爲四種顏色之一。現在代碼在firebug中工作，但不起作用，當我把它放入我的頁面標題中的標記中時。

我在做什麼錯？

<script type="text/javascript" src="../../../Scripts/jquery-1.6.1.min.js"> 



    $(document).ready(function() { 

     $(".myGridView1 tr").each(function() { 



      $("td").filter(function() { return $.text([this]) == '1'; }).css('background', 'green'); 

      $("td").filter(function() { return $.text([this]) == '2'; }).css('background', 'orange'); 

      $("td").filter(function() { return $.text([this]) == '3'; }).css('background', 'red'); 

      $("td").filter(function() { return $.text([this]) == '4'; }).css('background', 'blue'); 

     }); 

    }); 



</script> 

Answer 1

您不能在包含頁面代碼的相同標記中包含外部腳本。它必須是一個獨立的，空標籤：

<script type="text/javascript" src="http://code.jquery.com/jquery.js"></script> 
<script> 
    // my script 
</script> 

此外，還有一些注意事項：

的.each()功能並不做任何事情在你的代碼，但運行過濾器的功能太多次。對於每個tr，您正在查看每td，而不只是當前行中的那些。如果您取出.each()，代碼仍然有效：

演示：http://jsfiddle.net/jtbowden/dgswh/

其次，而不是過濾，只需添加功能，以您的.css()電話：

var colors = {'1': 'green', '2': 'orange', '3': 'red', '4': 'blue' }; 

$("td").css('background-color', function(index, value) { 
    var txt = $(this).text(); 
    if(colors.hasOwnProperty(txt)) { 
     return colors[txt]; 
    } 
    return value; 
}); 

演示：http://jsfiddle.net/jtbowden/dgswh/2/

這會將您的代碼減少到一次調用，而不是4次（並且它僅對每個td運行一次）。如果你想限制它只是表，更改選擇：

$(".myGridView1 td").css('background-color', function(index, value) { ... }); 

跟進

要改變顏色後，請從td文字，你可以這樣做：

$("td").css('background-color', function(index, value) { 
    var txt = $(this).text(); 
    $(this).text(""); // ADD THIS LINE 
    if(colors.hasOwnProperty(txt)) { 
     return colors[txt]; 
    } 
    return value; 
}); 

如果你只是想刪除的td s表示匹配的文本，招行：

$("td").css('background-color', function(index, value) { 
    var txt = $(this).text(); 
    if(colors.hasOwnProperty(txt)) { 
     $(this).text(""); // MOVE TO HERE 
     return colors[txt]; 
    } 
    return value; 
}); 

重要的是要注意，如果沒有某種樣式，如果您清空表格單元格，它可能會摺疊爲零寬度，或者如果一行中的所有單元格都爲空，則該行可能會摺疊到零高度。如果是這樣的話，無論是增加對tdmin-height和min-width定義在你的CSS，或更改$(this).text("")到$(this).html(' ')

演示：http://jsfiddle.net/jtbowden/dgswh/5/

如果你想保留的數量，但又不希望它是可見的，你可以隱藏或不可見div包裹td的內容：

$(this).wrapInner("<div style='visibility:hidden'>"); 

或者：

$(this).wrapInner("<div style='display:none'>"); 

演示：http://jsfiddle.net/jtbowden/dgswh/6/

Answer 2

每個腳本都需要自己的標籤，就像這樣：

<script type="text/javascript" src="../../../Scripts/jquery-1.6.1.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
    $(".myGridView1 tr").each(function() { 
     $("td").filter(function() { 
      return $.text([this]) == '1'; 
     }).css('background', 'green'); 

     $("td").filter(function() { 
      return $.text([this]) == '2'; 
     }).css('background', 'orange'); 

     $("td").filter(function() { 
      return $.text([this]) == '3'; 
     }).css('background', 'red'); 

     $("td").filter(function() { 
      return $.text([this]) == '4'; 
     }).css('background', 'blue'); 

    }); 
});​ 
</script> 

是的原因是JavaScript被加載到指定標記的HTML（如果您指定的URL）和意志據我所知，覆蓋當前腳本標記內的內容。因此，如果您在設置了網址的<script>標記中收到任何內容，它將被覆蓋，因此無法執行。

此外，它是Javascript編程，而不是jQuery編程。 jQuery是一個與Javascript一起使用的庫。

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.