0
$(function () {
        $("#dropdown").live("change keyup", function () {
            $("#theform").submit();
        });
    });

<form method="GET" id="theform" action="">
            <select name="dropdown" id="dropdown">
                <option value="1">One</option>
                <option value="2">Two</option>
                <option value="3" id="nosubmit">Three</option>
            </select>
        </form>

如果选择了选项三,我想显示另一个下拉列表(不提交表单):

<form method="GET" id="theform2" action="">
            <select name="dropdown2" id="dropdown2">
                <option value="4">Four</option>
                <option value="5">Five</option>
                <option value="6">Six</option>
            </select>
        </form>

如果选择了一个特定选项,我该怎么做才能不让它自动提交?Also when that option is selected how would I know? 在这种情况下,我需要显示另一个下拉列表。

4

4 回答 4

1

在您监视事件的 jQuery 中,您只需在继续使用 submit() 之前进行一些检查。

$(function () {
    $("#dropdown").live("change keyup", function () {
        if($(this).val() != 3)
        {
            $("#theform").submit();
        }
        else
        {
            $("#dropdown2").show();
        }
    });
});

请注意,您不应将#dropdown2 选择放入它自己的表单中,除非您只想提交一组数据或另一组数据。如果您希望将所有内容放在一起,请将其放在一个表单中。

于 2012-05-06T17:00:19.817 回答
1
$("body").on("change keyup", "#dropdown", function () {
            if(this.value == 3) {
               $('#theform2').show();
            } else {
               $('#theform2').hide();
               $("#theform").submit();
            }
});

并将css设置为#theform2 {display: none}

于 2012-05-06T17:05:57.740 回答
1

试试这个:http: //jsfiddle.net/LYdat/

HTML

<form method="GET" id="theform" action="">
    <select name="dropdown" id="dropdown">
        <option value="1">One</option>
        <option value="2">Two</option>
        <option value="3" id="nosubmit">Three</option>
    </select>
</form>

<form method="GET" id="theform2" action="">
    <select name="dropdown2" id="dropdown2">
        <option value="4">Four</option>
        <option value="5">Five</option>
        <option value="6">Six</option>
    </select>
</form>​

JS

$(function () {
    $("#dropdown").live("change keyup", function () {
        if($(this).val() == '3') {
            $('#theform2').show();
        } else {
            $('#theform2').hide();
            $("#theform").submit();
        }
    });
});

​<strong>CSS

#theform2 {
    display: none;
}​
于 2012-05-06T17:02:09.863 回答
1

如果您想在文本上执行此操作,即“三”

$(function () {
        $("#dropdown").live("change", function () {
            if($("#dropdown :selected").text() == "Three")
            {
                $("#dropdown2").hide();
                return false;
            }
            else
            {
               $("#theform").submit();
            }
        });
    });

如果您想按价值(即“3”)进行操作,请尝试此操作

 $(function () {
        $("#dropdown").live("change", function () { 
            if($(this).val() == "3")      
            {
                $("#dropdown2").hide();
                return false;
            }
            else
            {
               $("#theform").submit();
            }
        });
    });
于 2012-05-06T17:04:25.743 回答