如何在提交表单时使用 JavaScript 进行验证?

How to do validation with JavaScript when the form is submitted?

我试图让我的下拉框在 JQuery 对话框中正常工作。我有 4 个不同的选项。如果我 select 4 个中只有 2 个具有值 A 或 B,那么我的第二个下拉菜单应该允许我 select 是或否,否则 NONE。这是我的下拉框代码:

 <div id="Dialog">
        <table>
            <tr><td align="left">Slecet Type</td>
            <td><select name="Type" id="Type">
                    <option value="A">One</option>
                    <option value="B">Two</option>
                    <option value="C">Three</option>
                    <option value="D">Four</option>
                </select>
           </td>
        </tr>
        <tr>
        <td align="left">Slecet Option</td>
        <td>
            <select name="drop" id="drop">
                <option value="">Select One</option>
                <option value="1">Yes</option>
                <option value="0">No</option>
                <option value="99">None</option>
            </select>
        </td>
    </tr>
    </table>
</div>

所以如果我在我的第一个下拉列表中 select 一个或两个,只有在这种情况下我才能在我的第二个下拉列表中 select 是或否,否则应该是 NONE .我试图通过冷融合验证来解决这个问题,但这对我不起作用。

<cfif getQuery.Type EQ 'A' OR getQuery.Type EQ 'B'>
      <option value="1">Yes</option>
      <option value="0">No</option>
<cfelse>
      <option value="99">None</option>
</cfif>

所以现在我正在尝试使用 jQuery 来解决这个问题,但我无法让它工作。这是我的 jQuery 代码,我在其中尝试实施验证:

$("#Dialog").dialog({
            title:'Hello World',
            modal:true,autoOpen:false,width:600,
            buttons: { 
  'Continue': function(){mydrop = $('#drop');
            if($(mydrop).val() != 'A' || $(mydrop).val() != 'B'){alert('Please   select different');};$(this).dialog('close');} }
        }); 

我不确定我是否可以在“继续”按钮的这个函数中使用这段代码,或者它应该放在其他地方。如果您知道我应该更改什么,请告诉我。

您需要获取选定的选项值才能进行验证,而不仅仅是检查下拉值。

if($('#drop option:selected').val() != 'A' || $('#drop option:selected').val() != 'B')

根据您关于是否应将验证逻辑放在“继续”按钮内的建议,如果您的验证仅检查 value = 'A' 或 'B' ,那么您可以将其保留在原处, 但如果逻辑变得复杂并且需要更多 if-else 检查,请创建另一个 js 函数。

这是一个 fiddle 的动作:http://jsfiddle.net/dmfawp8g/11/