無法在HTML中加載多個JavaScript

我在HTML中有一個表，我有一些jQuery的功能，我想與表一起使用。但是，當我插入兩個功能，他們停止工作。這是代碼。無法在HTML中加載多個JavaScript

功能1個

// When document is ready: this gets fired before body onload <img  src='http://blogs.digitss.com/wp-includes/images/smilies/icon_smile.gif' alt=':)'  class='wp-smiley' /> 
window.onload = function() { 
// Write on keyup event of keyword input element 
$("#kwd_search").keyup(function() { 
    // When value of the input is not blank 
    if ($(this).val() != "") { 
     // Show only matching TR, hide rest of them 
     $("#tfhover tbody>tr").hide(); 
     $("#tfhover td:contains-ci('" + $(this).val() + "')").parent("tr").show(); 
    } 
    else { 
     // When there is no input or clean again, show everything back 
     $("#tfhover tbody>tr").show(); 
    } 
}); 
}; 
// jQuery expression for case-insensitive filter 
$.extend($.expr[":"], 
{ 
"contains-ci": function (elem, i, match, array) { 
    return (elem.textContent || elem.innerText || $(elem).text() ||  "").toLowerCase().indexOf((match[3] || "").toLowerCase()) >= 0; 
} 
    });

功能2

window.onload = function() { 
var tfrow = document.getElementById('tfhover').rows.length; 
var tbRow = []; 
for (var i = 1; i < tfrow; i++) { 
    tbRow[i] = document.getElementById('tfhover').rows[i]; 
    tbRow[i].onmouseover = function() { 
     this.style.backgroundColor = '#ffffff'; 
    }; 
    tbRow[i].onmouseout = function() { 
     this.style.backgroundColor = '#d4e3e5'; 
    }; 
} 
};

下面是HTML

<head runat="server"> 
<title></title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 

<script type="text/javascript" src="hl.js"></script> 
<script type="text/javascript" src="f.js"></script>  
<script type="text/javascript"> 



</script> 


<style type="text/css"> 
table.tftable {font-size:12px;color:#333333;width:100%;border-width: 1px;border-color: #729ea5;border-collapse: collapse; width:auto; overflow-x:auto;} 
table.tftable th {font-size:12px;background-color:#acc8cc;border-width: 1px;padding: 8px;border-style: solid;border-color: #729ea5;text-align:left;} 

table.tftable tr {background-color:#d4e3e5;} 
table.tftable td {font-size:12px;border-width: 1px;padding: 8px;border-style: solid;border-color: #729ea5;} 
    .auto-style1 { 
     height: 32px; 
    } 
</style> 
</head>

來源

2012-10-27 user1770970

「他們停止工作」是不是一個錯誤消息，也不是一個問題說明。 – PeeHaa

實際上你只能有一個'window.onload'函數，第二個會覆蓋第一個函數。你應該使用'document.ready'？ – adeneo

你的第二個window.onload func重寫第一個。

而且，使用jQuery，你怎麼稱呼它WAY不同使它比較容易的方式，是這樣的：

<head runat="server"> 
    <title></title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
    <script type="text/javascript"> 

     $(function() { 
      // Write on keyup event of keyword input element 
      $("#kwd_search").keyup(function() { 
       // When value of the input is not blank 
       if ($(this).val() != "") { 
        // Show only matching TR, hide rest of them 
        $("#tfhover tbody>tr").hide(); 
        $("#tfhover td:contains-ci('" + $(this).val() + "')").parent("tr").show(); 
       } 
       else { 
        // When there is no input or clean again, show everything back 
        $("#tfhover tbody>tr").show(); 
       }; 
      }); 

      // jQuery expression for case-insensitive filter 
      $.extend($.expr[":"], { 
        "contains-ci": function (elem, i, match, array) { 
         return (elem.textContent || elem.innerText || $(elem).text() || "").toLowerCase().indexOf((match[3] || "").toLowerCase()) >= 0; 
        } 
      }); 

      var tfrow = document.getElementById('tfhover').rows.length; 
      var tbRow = []; 
      for (var i = 1; i < tfrow; i++) { 
       tbRow[i] = $("#tfhover")[0].rows[i]; 
       var row = $(tbRow[i]); 
       row.hover(function(eIn) { 
        $(this).css({ "background-color": "#ffffff" }); 
       }, 
       function(eOut) { 
        $(this).css({ "background-color": "#d4e3e5" }); 
       }); 
      }; 
     }) 

    </script>

來源

2012-10-27 18:14:48 SpYk3HH

所以我會在HTML中調用它，或者你是否建議將上面的代碼粘貼到HTML中？ – user1770970

代替使用window.onload使用$(window).load(function(){...})。實際上你在Function 2覆蓋window.onload。

$(window).load(function(){ 

    ....// your code 

});

來源

2012-10-27 17:19:18 Anoop

如果我把這個功能停止運行 – user1770970

無法在HTML中加載多個JavaScript

回答

相關問題