JQuery Validate：Safari中的“未选择”

Posted 2023-05-09

【中文标题】JQuery Validate：Safari中的“未选择”

【英文标题】：JQuery Validate: "nothing selected" in Safari

【发布时间】：2011-12-05 18:07:51

【问题描述】：

我正在使用 JQuery Validate，它在 Safari 中做着最奇怪的事情。如果我不选择任何东西，它会给我正确的错误消息。但是一旦我满足表单要求并点击提交，它只会刷新页面而不是提交表单。控制台消息是“未选择，无法验证，未返回任何内容”。

这是我的验证脚本：

$(文档).ready(函数() /* ------------ 表格#STORY1 ------------ */ $('#class').focus(function() $('#alum').attr('checked',true); ); $('#college').focus(function() $('#transfer').attr('checked',true); ); /* 验证脚本 */ $("#story1").submit(function() return false; ); // 把我们的验证器变成一个函数 var story1Validate = 函数（表单） $(form).find('div#err_msg').hide(); $(form).find('#submitBtn').removeAttr('disabled'); $(form).validate( 调试：假， 提交处理程序：函数（表单） $('#submitBtn').attr('disabled','disabled'); $('#submitBtn').hide(); $('#process').show(); $('#recaptcha_widget_div').hide(); form.submit(); , errorContainer: $(form).find('div#err_msg'), 错误放置：函数（错误，元素） $(form).find('div#err_msg').show(); error.appendTo(form+' div#err_msg'); , 规则： 类型：“必需”， 班级： 必需：“#alum:checked” , 大学： 必需：“#transfer:checked” ,//规则 消息： type: "请进行选择。", 班级： 必填：“您表明您是校友，请输入您毕业的年份。” , 大学： 必填：“您表示自己是转校生，请输入您转入的学校名称。” //消息 );//表单验证 //自定义验证函数 // 将我们自定义的表单函数附加到表单中 story1Validate("#story1"); );

这是随附表单的 html：

      <form id="story1" name="story1" method="post" action="your-story/index.php" class="form-intro">
        <h3>I am a...</h3>
        <p>
          <input name="type" type="radio" class="input-radio" id="alum" value="alum" /> <label for="alum">Alum, class of</label><br />
                 <input name="class" type="text" class="input-txt" id="class" value="" />
        </p>
        <p>
          <input name="type" type="radio" class="input-radio" id="transfer" value="transfer" /> <label for="transfer">Transfer student to</label><br />
                 <input name="college" type="text" class="input-txt" id="college" value="" />
        </p>
        <p>
          <input name="type" type="radio" class="input-radio" id="student" value="student" /> <label for="student">Current student</label>
        </p>
        <p>
          <input name="type" type="radio" class="input-radio" id="staff" value="staff" /> <label for="staff">Professor or staff member</label>
        </p>
        <p>
          <input name="type" type="radio" class="input-radio" id="" value="other" /> <label for="other">None of the above</label>
        </p>
    <div id="err_msg">
    </div>
        <footer class="form-nav">
          <input name="submitBtn" type="submit" class="input-btn" id="submitBtn" value="Next &gt;" />
        </footer>
      </form>

我只在 Safari（Mac 和 PC）上看到它这样做，偶尔当我提交表单然后点击 Firefox 中的后退按钮时。似乎在 IE 中也可以正常工作。

有什么想法吗？？这让我发疯了！

【问题讨论】：

你的JS控制台有错误吗？

不，只是“没有选择，无法验证，没有返回”警报。将验证设置为调试不会更改控制台输出。

【参考方案1】：

好的，我让一个朋友在他的 Safari 中查看它，他的控制台在 JS 中抛出了一个错误（尽管我的没有）。显然我不应该将任何输入字段命名为“类”。我应该知道的更好。无论如何，在所有实例中将其从 name="class" 更改为 name="classOf" 就可以摆脱它。

然后我又探索了一些，发现它不喜欢在 form.submit() 之前禁用提交按钮。所以我将提交处理程序更改为：

               submitHandler: function(form) 
               form.submit();
           

现在我只需要弄清楚为什么我的控制台没有抛出第一个错误。 ;_;