1. 首頁
  2. 問答
  3. JQUERY IE 7,8錯誤信息：預期標識符，字符串或數字

JQUERY IE 7,8錯誤信息：預期標識符，字符串或數字

2011-03-27 50 views
2 
Line: 151 
Character: 6 
Code: 0 
Error Message: Expected identifier, string or number

該腳本在Chrome，ff，opera中工作正常，但在ei 6,7和8中出現了上述錯誤，甚至不會觸發click事件。JQUERY IE 7,8錯誤信息：預期標識符，字符串或數字

編輯一人指出，有上述

如說didnt需要在那裏，所以我刪除，並得到這個錯誤 

Line: 232 
Character: 3 
Code: 0 
Error Message: Object doesn't support this property or method

下面是編輯的原始代碼中刪除逗號一個逗號 

<?php switch($_GET['size']){ case"3metre": $panelwidth=75; $panelheight=69; break; case"4metre": $panelwidth=89; $panelheight=69; break; }; $fourpanels = $panelwidth * 4; ?> <!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=utf-8" /> <title>Untitled Document</title> <!-- JS --> <script type="text/javascript" src="plugins/validator/jquery-1.4.4.min.js"></script> <script type="text/javascript" src="plugins/ui/jquery.effects.core.js"></script> <!-- STYLES --> <style> <!-- LAYOUT --> <!-- SKIRTS --> .panelContainer{ height:128px; width:900px; float:left; } .endpanel{ width:<?php echo $panelwidth*2;?>px; float:left; height:118px; background:#BFDDF2; border:1px solid #7DB8DB; } .panel{ width:<?php echo $panelwidth*2;?>px; bottom:0; float:left; height:118px; background:#BFDDF2; border:1px solid #7DB8DB; } .mid{ border-left:0px; } .door:hover{ width:<?php echo $panelwidth*2;?>px; float:left; height:118px; background:#ECF5FB; border:1px solid #fff; } .panelselected{ width:<?php echo $panelwidth*2;?>px; float:left; height:118px; background:#ECF5FB; border:1px solid #fff; } .container{ min-width:<?php echo $panelwidth*2;?>px; width:auto; float:left; margin-top:3px; height:7px; } .button{ width:7px; height:7px; margin:3px; } .left{float:left;} .right{float:right;} </style> </head> <body> <div style="width:780px; height:80px;float:left;"> <h3>Please select a panel and customise the width and height to fit under your door step/doorway</h3> <ul> <li>Total Draught Skirt Width: <input type="text" disabled id="totalwidth" value="<?php echo $panelwidth*5;?>"/>(CMS) </li> </ul> </div> <!-- CUSTOMISE DOOR --> <div style="margin-top:20px; min-width:780px; height:80px;float:left;position:relative;"> <div class="endpanel" id="panel1"> <img src="images/draught-skirts/button.png" class="button left"/> </div> <div id="panel2" class="panel mid door"> </div> <div id="panel3" class="panel mid door"></div> <div id="panel4" class="panel mid door"></div> <div class="endpanel mid" id="panel5"> <img src="images/draught-skirts/button.png" class="button right"/> </div> </div> <div id="customisedoor" style="clear:both; margin-top:50px;width:400px; height:80px;float:left; display:none;"> <strong>Customise Your Door Panel</strong> <table> <tr> <td>Width</td> <td> <input type="number" name="width" id="doorwidth" value="<?php echo $panelwidth;?>"/>(CMS) </td> </tr> <tr> <td>Height From Top of Skirt: </td> <td> <input type="number" name="height" id="doorheight" value="30"/>(CMS) </td> </tr> <tr> <td></td> <td><input type="button" id="reset" value="Reset"/></td> </tr> </table> </div> <script type="text/javascript"> /////////// $("div.door").click(function() { $("div.door").removeClass("panelselected"); $(this).toggleClass("panelselected"); selectedID = $(this).attr("id"); resetall(); alert("IDis"+selectedID); $("#customisedoor").fadeIn("slow"); $("#"+selectedID).animate({ height: 118-Number($("#doorheight").val())*2+"px" }, 200); height = 118-Number($("#doorheight").val())*2; topmargin = Number($("#doorheight").val())*2; $("#"+selectedID).css("margin-top", topmargin+"px"); ////////////////////////////IF PANEL 2 if(selectedID === 'panel2'){ $("#panel1").append('<img src="images/draught-skirts/button.png" class="button right appended"/>'); $("#panel3").append('<img src="images/draught-skirts/button.png" class="button left appended"/>'); } ///////////////////////IF PANEL 3 if(selectedID === 'panel3'){ $("#panel2").append('<img src="images/draught-skirts/button.png" class="button right appended"/>'); $("#panel4").append('<img src="images/draught-skirts/button.png" class="button left appended"/>'); } ///////////////////////// ///////////////////////IF PANEL 3 if(selectedID === 'panel4'){ $("#panel3").append('<img src="images/draught-skirts/button.png" class="button right appended"/>'); $("#panel5").append('<img src="images/draught-skirts/button.png" class="button left appended"/>'); } ///////////////////////// }); $("#doorwidth").keyup(function(){ $("#"+selectedID).animate({ width: Number($("#doorwidth").val())*2+"px" }, 200); $("#totalwidth").val( parseInt(300) + parseInt($("#doorwidth").val()) ); }); $("#doorwidth").click(function(){ $("#"+selectedID).animate({ width: $("#doorwidth").val()*2+"px" }, 200); $("#totalwidth").val( parseInt(300) + parseInt($("#doorwidth").val()) ); }); function calculateheight(){ $("#"+selectedID).animate({ height: 118-$("#doorheight").val()*2+"px" }, 200); height = 118-$("#doorheight").val()*2; topmargin = $("#doorheight").val()*2; $("#"+selectedID).css("margin-top", topmargin+"px") } $("#doorheight").keyup(function(){ calculateheight(); }); $("#doorheight").click(function(){ calculateheight(); }); function resetall(){ $(".appended").remove(); $(".door").css({'width':'150','height':'118','margin':'0px'}); $(".door").removeClass("panelselected"); $("#doorheight").val(30); $("#doorwidth").val(75); $("#totalwidth").val(300+$("#doorwidth").val()); } $("#reset").click(function() { //alert("removed"); resetall(); }); ////////////////////////////////////////////////////////////////// $(function() { //$("#draggable").draggable({ axis: "y" }); //$("#draggable2").draggable({ axis: "x" }); $("#b2").draggable({ containment: "#bc2", scroll: false }); //$("#draggable4").draggable({ containment: "#demo-frame" }); //$("#draggable5").draggable({ containment: "parent" }); }); </script> </body> </html>

源從IE

<!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=utf-8" /> 
<title>Untitled Document</title> 
<!-- JS --> 

<script type="text/javascript" src="plugins/validator/jquery-1.4.4.min.js"></script> 
<script type="text/javascript" src="plugins/ui/jquery.effects.core.js"></script> 



<!-- STYLES --> 

<style> 
<!-- LAYOUT --> 


<!-- SKIRTS --> 
.panelContainer{ 
height:128px; 
width:900px; 
float:left; 
} 

.endpanel{ 
width:150px; 
float:left; 
height:118px; 
background:#BFDDF2; 
border:1px solid #7DB8DB; 
} 
.panel{ 
width:150px; 
bottom:0; 
float:left; 
height:118px; 
background:#BFDDF2; 
border:1px solid #7DB8DB; 
} 

.mid{ 
    border-left:0px; 
    } 

.door:hover{ 
width:150px; 
float:left; 
height:118px; 
background:#ECF5FB; 
border:1px solid #fff; 
} 

.panelselected{ 
width:150px; 
float:left; 
height:118px; 
background:#ECF5FB; 
border:1px solid #fff; 
} 
.container{ 
    min-width:150px; 
    width:auto; 
    float:left; 
    margin-top:3px; 
    height:7px; 
    } 

.button{ 
    width:7px; height:7px; 
    margin:3px; 

    } 
.left{float:left;} 
.right{float:right;} 





</style> 
</head> 

<body> 
<div style="width:780px; height:80px;float:left;"> 
    <h3>Please select a panel and customise the width and height to fit under your door step/doorway</h3>  

    <ul> 
     <li>Total Draught Skirt Width: <input type="text" disabled id="totalwidth" value="375"/>(CMS) </li> 
    </ul> 
</div> 
<!-- CUSTOMISE DOOR --> 


<div style="margin-top:20px; min-width:780px; height:80px;float:left;position:relative;"> 
     <div class="endpanel" id="panel1"> 
      <img src="images/draught-skirts/button.png" class="button left"/> 
     </div> 
     <div id="panel2" class="panel mid door"> 

     </div> 
     <div id="panel3" class="panel mid door"></div> 
     <div id="panel4" class="panel mid door"></div> 
     <div class="endpanel mid" id="panel5"> 
      <img src="images/draught-skirts/button.png" class="button right"/> 
     </div> 
</div> 

    <div id="customisedoor" style="clear:both; margin-top:50px;width:400px; height:80px;float:left; display:none;"> 


     <strong>Customise Your Door Panel</strong> 
    <table> 
     <tr> 
      <td>Width</td> 
      <td> 
       <input type="number" name="width" id="doorwidth" value="75"/>(CMS) 
      </td> 
     </tr> 
     <tr> 
      <td>Height From Top of Skirt: </td> 
      <td> 
       <input type="number" name="height" id="doorheight" value="30"/>(CMS) 
      </td> 
     </tr> 
    <tr> 
    <td></td> 
    <td><input type="button" id="reset" value="Reset"/></td> 
    </tr> 
     </table> 


    </div> 

    <script type="text/javascript"> 



/////////// 
    $("div.door").click(function() { 

      $("div.door").removeClass("panelselected"); 
      $(this).toggleClass("panelselected"); 
      selectedID = $(this).attr("id"); 
      resetall(); 
      alert("IDis"+selectedID); 
      $("#customisedoor").fadeIn("slow"); 
      $("#"+selectedID).animate({ 
       height: 118-Number($("#doorheight").val())*2+"px" 

      }, 200); 
      height = 118-Number($("#doorheight").val())*2; 
      topmargin = Number($("#doorheight").val())*2; 
      $("#"+selectedID).css("margin-top", topmargin+"px"); 
      ////////////////////////////IF PANEL 2 
      if(selectedID === 'panel2'){ 
$("#panel1").append('<img src="images/draught-skirts/button.png" class="button right appended"/>'); 
$("#panel3").append('<img src="images/draught-skirts/button.png" class="button left appended"/>'); 
      } 
      ///////////////////////IF PANEL 3 
      if(selectedID === 'panel3'){ 
$("#panel2").append('<img src="images/draught-skirts/button.png" class="button right appended"/>'); 
$("#panel4").append('<img src="images/draught-skirts/button.png" class="button left appended"/>'); 
      } 
      ///////////////////////// 
      ///////////////////////IF PANEL 3 
      if(selectedID === 'panel4'){ 
$("#panel3").append('<img src="images/draught-skirts/button.png" class="button right appended"/>'); 
$("#panel5").append('<img src="images/draught-skirts/button.png" class="button left appended"/>'); 
      } 
      ///////////////////////// 
    }); 

    $("#doorwidth").keyup(function(){ 

      $("#"+selectedID).animate({ 
       width: Number($("#doorwidth").val())*2+"px" 
       }, 200); 
$("#totalwidth").val(
    parseInt(300) + parseInt($("#doorwidth").val()) 
    ); 

}); 
    $("#doorwidth").click(function(){ 

      $("#"+selectedID).animate({ 
       width: $("#doorwidth").val()*2+"px" 
       }, 200); 
$("#totalwidth").val(
    parseInt(300) + parseInt($("#doorwidth").val()) 
    ); 

}); 
    function calculateheight(){ 
     $("#"+selectedID).animate({ 
       height: 118-$("#doorheight").val()*2+"px" 

       }, 200); 
       height = 118-$("#doorheight").val()*2; 
       topmargin = $("#doorheight").val()*2; 
     $("#"+selectedID).css("margin-top", topmargin+"px") 
    } 

     $("#doorheight").keyup(function(){ 
      calculateheight(); 
      }); 

     $("#doorheight").click(function(){ 
      calculateheight(); 

    }); 

    function resetall(){ 
     $(".appended").remove(); 
     $(".door").css({'width':'150','height':'118','margin':'0px'}); 
     $(".door").removeClass("panelselected"); 
     $("#doorheight").val(30); 
     $("#doorwidth").val(75); 
     $("#totalwidth").val(300+$("#doorwidth").val()); 

    } 

    $("#reset").click(function() { 
     //alert("removed"); 
     resetall(); 
    }); 
    ////////////////////////////////////////////////////////////////// 
    $(function() { 
     //$("#draggable").draggable({ axis: "y" }); 
     //$("#draggable2").draggable({ axis: "x" }); 

     $("#b2").draggable({ containment: "#bc2", scroll: false }); 
     //$("#draggable4").draggable({ containment: "#demo-frame" }); 
     //$("#draggable5").draggable({ containment: "parent" }); 
    }); 

    </script> 
</body> 
</html>

來源

2011-03-27 Tommy Arnold

+0

你能從你的瀏覽器發佈源碼輸出，所以我們可以交叉檢查行號？ – 2011-03-27 18:43:47

+1

你不應該用'var'作爲變量的前綴嗎？例如'var selectedID = $（this）。ATTR（「ID」）;' – 2011-03-27 18:44:05

回答

1

你應該真的把你的javascript代碼包裝在一個jQuery文檔就緒事件中。雖然可以在就緒事件之外應用綁定，但將它們放在裏面可以保證文檔已準備好定製事件。這對於緩慢的JavaScript實現（如Internet Explorer）的瀏覽器尤其重要。

jQuery(document).ready(function($) { 
    // put all your javascript code here 
});

來源

2011-03-27 18:48:05 macguru2000

+0

看到編輯後，我裹在jQuery的文檔代碼準備就緒，現在的作品，但是我仍然得到這個錯誤 線：152 性格：6 代碼：0 錯誤消息：對象不支持此屬性或方法 – 2011-03-27 18:52:22

+0

即使按鈕現在在IE中工作的錯誤消息？ – macguru2000 2011-03-27 19:22:47

+0

我會註釋掉或刪除所有的javascript代碼，看看錯誤消息是否消失。然後一次添加代碼塊，直到出現錯誤消息，現在我們知道哪一塊代碼是罪魁禍首。如果你可以在這裏發佈，我可能會幫助更多，我現在沒有我的Windows VM方便... – macguru2000 2011-03-27 19:25:44

2

顯然，線151是某處角落找尋此：

$("#"+selectedID).animate({ 
    height: 118-Number($("#doorheight").val())*2+"px", 

}, 200);

注有第二行的端部的逗號。


這逗號對象的最後一個元素之後 - 與對象的最後一個項目之後，你不能有一個逗號：將其刪除。

當然，您必須在其他地方做出相同的修改，例如calculateheight()函數。


1.即使一些瀏覽器，如Firefox，不會引發錯誤。

來源

2011-03-27 18:43:38

+0

看後期編輯，感謝 – 2011-03-27 18:53:51

0

後「PX」不應該存在，它會導致IE拋出該錯誤的逗號：

$("#"+selectedID).animate({ 
    height: 118-Number($("#doorheight").val())*2+"px", 
}, 200);

來源

2011-04-08 07:20:15

0

這可能是在IE的情況下，兼容性視圖問題。 第一步：Goto->工具 - >兼容性視圖設置 清除所有複選框

第二步：Goto->工具 - >兼容性視圖 撤銷選擇

來源

2012-06-28 19:06:27

相關問題

 相關問題