event-handling - 在jQuery中处理多个事件

Question

我有两个功能需要根据下拉列表中的选择来执行。

例如

如果Dropdownlist1值为“First”，则禁用Dropdownlist2并执行Function1
，如果Dropdownlist1值为“Second” ，则 如果选择“Third”作为值，则启用Dropdownlist2并执行。我在 Document ready 事件中尝试了一个常规的 if 语句，但无法实现我想要的上面。Function2
Dropdownlist2

这是我到目前为止所拥有的：

形式：

                 <th>
                    Dropdown List 1
                </th>
                <td>
                    <%= Html.Telerik().DropDownList().Name("DropDownList1")
                    .HtmlAttributes(new { @id = "DropDownList1" })
                    .Items(items => {
                        items.Add().Text("").Value("");
                        items.Add().Text("New").Value("First");
                        items.Add().Text("Existing").Value("Second");
                            })%> 
                </td>

                 <th>
                    Dropdown List 2
                </th>
                <td>
                    <%= Html.Telerik().DropDownList().Name("DropDownList2")
                    .HtmlAttributes(new { @id = "DropDownList2" })
                    .Items(items => {
                        items.Add().Text("").Value("");
                        items.Add().Text("Three").Value("Three");
                            })%> 
                </td>

查询：

$(function () {
$("#Dropdownlist1").focusout(func1);
});

function func1() {

$("#Dropdownlist1").focusout(function(){
    if($("#Dropdownlist1").val() == "First"){
        $("#Dropdownlist2").attr('disabled','disabled')
        Function1()
    }
    else if ($("#Dropdownlist1").val() == "Second"){
        $("#Dropdownlist2").attr('disabled','')
        $("#Dropdownlist2").focusout(function(){Function2()})
    }
});   

}

Answer 1

html:

<select id="options">
    <option value=1>option 1</option>
    <option value=2>option 2</option>
    <option value=3>option 3</option>
</select>

JS：

function func1() { alert('hello from func 1'); };
function func2() { alert('hello from func 2'); };
function func3() { alert('hello from func 3'); };

$('#options').change(function() {

    if ($(this).val() == 1) {
         func1();
    } else if ($(this).val() == 2) {
         func2();    
    } else if ($(this).val() == 3) {
         func3();
    }
});​

Answer 2

如果我正确阅读了上面的帖子，这应该可以满足您的要求……或者至少为您指明正确的方向。

$("#Dropdownlist1").change(function(){
  //if Dropdownlist1 value is "First" then Disable Dropdownlist2 and Execute Function1
  if($(this).val() == "First"){
    $("#Dropdownlist2").attr("disabled", "disabled");
    function1();
  }
  //if Dropdownlist1 value is "Second" then Enable Dropdownlist2 and Execute Function2
  else if($(this).val() == "Second"){
    $("#Dropdownlist2").removeAttr("disabled");
    function2();
  }
});

$("#Dropdownlist2").change(function(){
  //and Execute Function2 if "Third" is selected as Dropdownlist2 value
  if($(this).val() == "Third")
    function2();
});