如何使网络表单在下拉选择中自动提交

发布于 2024-10-22 11:37:30 字数 718 浏览 1 评论 0原文

我的页面中有一个如下所示的表单；

<form name="testform" id="testform" action="test.php" method="get">
  <input name="field1" id="field1" type="text" value="">
  <input name="field2" id="field2" type="text" value="">
  <select name="dropdown" id="dropdown">
    <option value="option1" selected="selected">option1</option>
    <option value="option2">option2</option>
    <option value="option3">option3</option>
  </select>
  <input type="submit" name="Submit" value="Submit" id="Submit">
</form>

我希望当用户从下拉菜单中选择一个选项时自动提交表单。使用或不使用 JavaScript（使用或不使用 jQuery）如何执行此操作？

提前致谢...:)

blasterafred

原文

I have a form in my page like the one below;

<form name="testform" id="testform" action="test.php" method="get">
  <input name="field1" id="field1" type="text" value="">
  <input name="field2" id="field2" type="text" value="">
  <select name="dropdown" id="dropdown">
    <option value="option1" selected="selected">option1</option>
    <option value="option2">option2</option>
    <option value="option3">option3</option>
  </select>
  <input type="submit" name="Submit" value="Submit" id="Submit">
</form>

I want the form to get submitted automatically when user select an option from the drop-down menu. How can I do this with or without using JavaScript (with or without jQuery)?

Thanks in advance... :)

blasteralfred

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

空‖城人不在 2024-10-29 11:37:30

单击（或选择）？在这种情况下，用户将无法做出任何选择。您可能是指一旦选择了另一个选项。如果是这样

<select name="dropdown" id="dropdown" onchange="this.form.submit()">

如果使用jQuery，则不显眼的事件处理程序change 应该使用而不是内联 JavaScript。

$(function(){
    $("#dropdown").change( function(e) {
        this.form.submit();
    });
});

如果表单元素是动态添加到 DOM 中的，请使用 on

$(function(){
    $('#testform').on( "change", "#dropdown", function(e) {
        this.form.submit();
    });
});

Click (or select)? In that case the user would not be able to make any selection. You probably mean as soon as another option is selected. If so

<select name="dropdown" id="dropdown" onchange="this.form.submit()">

If jQuery is being used, unobtrusive event handler change should be used instead of inline javascript.

$(function(){
    $("#dropdown").change( function(e) {
        this.form.submit();
    });
});

Use on if the form elements are dynamically being added in the DOM

$(function(){
    $('#testform').on( "change", "#dropdown", function(e) {
        this.form.submit();
    });
});

回复收藏 0 原文

荒路情人 2024-10-29 11:37:30

您将需要使用 jQuery change() 事件。

('#dropdown').change( function() { ('#testform').submit(); })

You will need to use the jQuery change() event.

('#dropdown').change( function() { ('#testform').submit(); })

回复收藏 0 原文

深居我梦 2024-10-29 11:37:30

我想

$('#dropdown').change(function () { $('Submit').click(); } );

会成功的！

I think

$('#dropdown').change(function () { $('Submit').click(); } );

will do the trick!

回复收藏 0 原文

木格 2024-10-29 11:37:30

在这里回答

<form name="testform" id="testform" action="test.php" method="get">
              <input name="field1" id="field1" type="text" value="">
              <input name="field2" id="field2" type="text" value="">
              <select name="dropdown" id="dropdown" onChange="document.testform.submit()">
            <option value="option1" selected="selected">option1</option>
            <option value="option2">option2</option>
            <option value="option3">option3</option>
            </select>
  </form>

Here Answer

<form name="testform" id="testform" action="test.php" method="get">
              <input name="field1" id="field1" type="text" value="">
              <input name="field2" id="field2" type="text" value="">
              <select name="dropdown" id="dropdown" onChange="document.testform.submit()">
            <option value="option1" selected="selected">option1</option>
            <option value="option2">option2</option>
            <option value="option3">option3</option>
            </select>
  </form>

回复收藏 0 原文

~没有更多了~