jQuery的，Firefox中：事件的preventDefault不工作

Question

我必須在我看來，下面的代碼在MVC：

<script src="../../Scripts/jquery-1.6.4.js" type="text/javascript"></script> 
    <script src="../../Scripts/jquery-1.6.4.min.js" type="text/javascript"></script> 
    @model IEnumerable<GeoGame.Models.ConsiderResponse> 
    @{ 
     ViewBag.Title = "Show Second Day Comments"; 
    } 
    <h2> 
     Show Second Day Comments</h2> 
    @using (Html.BeginForm("StoreThirdDayComments", "DiscussionForum", FormMethod.Post)) 
    { 
     <p> 
      <a href="#" id="instrReminder">Instructions</a> 
     </p> 
     @Html.ValidationSummary(true) 
     <table> 
      <tr> 
       <th> 
        User 
       </th> 
       <th width="85%"> 
        Comments 
       </th> 
       <th> 
        My reaction 
       </th> 
      </tr> 
      @foreach (var item in Model) 
      { 
       <tr class="choice"> 
        <td> 
         @Html.DisplayFor(modelItem => item.memberNumber) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.justification) 
        </td> 
        <td> 
         @Html.RadioButton("Opinion_" + item.ID, "Agree")<font style="background-color: green" 
          color="black"> Agree </font> 
         <br /> 
         @Html.RadioButton("Opinion_" + item.ID, "Disagree")<font style="background-color: red" 
          color="black"> Disagree </font> 
         <br /> 
         @Html.RadioButton("Opinion_" + item.ID, "Neither")<font style="background-color: yellow" 
          color="black"> Neutral </font> 
        </td> 
       </tr> 
      } 
     </table> 
     <br />   
      <label> 
      Please respond to <b>each</b> of your peers' comments using the following pattern:</label> 
     <br /> 
     <br /> 
     <text><i>I agree/disagree/am neutral with 1's comments because: (insert comments)</i></text> 
     <br /> 
     <br /> 
     <div> 
      <textarea rows="7" cols="75" id="ThirdDayComments" name="ThirdDayComments"></textarea> 
     </div> 
     <p> 
      <input type="submit" id="btnSubmit" value="Submit and answer question -->" /> 
     </p> 
    } 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#btnSubmit').click(function (e) { 
       var isValid = true; 
       if ($.trim($("#ThirdDayComments").val()) == '') {     
        isValid = false; 
       } 
       if ($('tr.choice').not(':has(:radio:checked)').length) {     
        isValid = false; 
       } 
       if (isValid == false) { 
        alert('Please choose agree, disagree, neutral for each comment and explain the reasons in the textbox provided'); 
       } 
       if (isValid == false) { 
        e.returnValue = false; 
        e.preventDefault(); 
       } 
      }); 
      $('#instrReminder').click(function (e) { 
       alert("1. Read the comments made by your peers.\n2. Select agree/disagree/neutral for each of them.\n3. Fill out the text box according to the pattern mentioned.\n4. Click submit.\n5. You will be taken to a page with a question with multiple-choice answers.\n"); 
       e.returnValue = false; 
       e.preventDefault(); 
      }); 
     });    
    </script> 

我想阻止該網頁時，單選按鈕沒有選擇或文本框繼續沒有填充。這適用於Chrome。但是，在Firefox中，如果用戶單擊提交幾次而沒有選擇單選按鈕或填充文本框，則會彈出警告消息（如代碼中所示），但也會「防止其他彈出窗口」。當選擇了這個選項，並且當我再次提交時，頁面確實不是而是。它只是通過。我做不是想要的。
我檢查了很多其他帖子，但他們似乎沒有完全解決這個問題。
有關如何解決這個問題的任何想法在Firefox？我正在使用版本36.0.1。

Answer 1

您需要將兩個isValid == false條件加在一起，並在alert之前加上preventDefault。試試這個：

if (isValid == false) { 
    e.returnValue = false; 
    e.preventDefault(); 
    alert('Please choose agree, disagree, neutral for each comment and explain the reasons in the textbox provided'); 
} 

需要在#instrReminder元素的點擊處理程序中完成相同的操作。

Answer 2

這是幾個警報被Firefox阻止後返回錯誤。 解決方案是不提醒多次或根本不提醒，更好的事件處理程序選擇是表單提交而不是提交按鈕點擊。

這樣的 - 假設形式的ID是DiscussionForum

$('#DiscussionForum').on("submit",function (e) { 
    var isValid = true; 
    $("#message").empty(); 
    if ($.trim($("#ThirdDayComments").val()) == '') {     
    isValid = false; 
    } 
    if ($('tr.choice').not(':has(:radio:checked)').length) {     
    isValid = false; 
    } 
    if (!isValid) { 
    e.returnValue = false; 
    e.preventDefault(); 
    $("#message").html('Please choose agree, disagree, neutral for each comment and explain the reasons in the textbox provided'); 
    } 
}); 

Answer 3

一旦你告訴火狐，你不希望頁面生成更多的警示，alert()結果調用一個異常被拋出。

兩種方式來解決這個問題：

1. 包裝你撥打alert()在try catch：

   try { 
       alert("whatever"); 
   } 
   catch (err) { 
       console.log("denied"); 
   } 
   

   現在異常將被處理。

2. 停止使用alert()，因爲它很醜並導致像現在面臨的問題。