Question

我有一个包含大约五个选项的下拉菜单和一个将其作为表单提交的按钮。我想知道是否可以在onclick中执行验证，以便您对选择的任何选项进行不同的验证。

因此，例如，如果用户选择选项Milk并单击该按钮，则onclick将使用方法A进行vaildate，其中就好像用户选择了Cheese并单击该按钮一样，onclick将使用方法B进行验证。

目前我只能点击以对所有选定的选项使用单一验证。

感谢您的帮助。

Answer 1

在您的函数onClick中检查您的选择值

function methodA(){
    //
}
function methodB(){
    //
}

function doOnClick(){
    switch($('your-select').val()){
        case 0 :
           methodA();
        break; 

        case 1 :
           methodB();
        break; 
    }
}

Answer 2

HTML：

<form id="formid">
    <select id="selectid">
        <option value="milk"> Milk </option>
        <option value="sugar"> Sugar</option>
    </select>
</form>

JS：

var validationRules = {
    'milk': function(){
        // validate
        return false;
    },
    'sugar': function(){
        // validate
        return true;
    }
}

var form = document.getElementById('formid');
var select = document.getElementById('selectid');


select.addEventListener('change', function(){
    var value = this.options[this.selectedIndex].value;
    form.valid = validationRules[value]();
});


form.addEventListener('submit', function(){
    return this.valid;
});

Answer 3

http://jsfiddle.net/adYtd/

获取select选项的值，然后将其用作保存验证函数的对象的键。

var Validation_Functions = {
    1: function(x){alert("1"+x);},
    2: function(x){alert("2"+x);},
    3: function(x){alert("3"+x);},
    4: function(x){alert("4"+x);},
}
$("#btn").on("click", function() {
    var val = $("#sel").val();
    Validation_Functions[val](" test");
});

在下拉菜单中对特定选项执行onclick验证

3 个答案: