jquery - 禁用/模拟“输入”提交按钮的行为

Question

编辑** 为了让这一点更清楚一点......

当我用鼠标单击输入放置按钮时，它会通过ajax发布，就像我希望的那样：mysite.com:8888/save/1?val= &val2=&val3=...

当我在文本字段中并点击“enter”时，它会提交给自身，而不是通过 ajax... 它就像常规提交表单一样工作... 我是只是想弄清楚如何获得“输入”按钮也可以通过ajax发布...

这是表单的（部分）html：

<legend>Add Directory Entry</legend>
<div id="statusmessage"></div>
<div class="form-radios clearfix">
    <label class="option" for="edit-type-0"><input id="edit-type-0" name="type" value="0" class="form-radio clearfix" type="radio"> option1</label>

    <label class="option" for="edit-type-1">
    <input id="edit-type-1" name="type" value="1" class="form-radio clearfix" type="radio"> option2 </label>

    <label class="option" for="edit-type-2">
    <input id="edit-type-2" name="type" value="2" class="form-radio clearfix" type="radio"> option3 </label>

    <label class="option" for="edit-type-3">
    <input id="edit-type-3" name="type" value="3" class="form-radio clearfix" type="radio"> option4 </label>
</div>

<label for="edit-name">Name: <span class="form-required" title="This field is required.">*</span></label>
<input maxlength="128" name="name" id="edit-name" size="60" value="" class="form-text required" type="text">

<label for="edit-phone">Phone: </label>
<input maxlength="128" name="phone" id="edit-phone" size="60" value="" class="form-text" type="text">

<input name="op" id="edit-save" value="Save Entry" class="form-submit ahah-processed" type="submit">

用于创建提交按钮的php是：

$form['addentry']['save'] = array(
        '#type' => 'submit',
        '#value' => t('Save Entry'),
        '#submit' => array(),
        '#ahah' => array(
            'path' => 'family/'.$user->uid.'/savenewentry',
            'wrapper' => 'ahah-example-new-row-wrapper',
            'method' => 'prepend',
            'effect' => 'fade',
            'progress' => array('type' => 'bar', 'message' => t('Please wait...')),
        ),
    );

所以，当我单击按钮时，我会得到进度指示等.，当我点击“输入”时，整个页面都会被提交并刷新...

---

我有一个使用提交按钮的ajax表单（必须是输入类型=“提交”...不能使用“按钮”） 。当我单击它时，它会按预期工作，因为它实际上并不“提交”信息，但当我按 Enter 时，它会完全提交表单。我一直在浏览这里的论坛，我可以找到很多讨论禁用该行为的帖子，但我希望它的工作方式就像“单击”按钮和按回车键一样工作......我尝试了在其他一些线程中发布的各种迭代（很多带有“preventDefault”），但它不断在输入时提交......

/*
There are a lot more fields, but if, for example, you're in the 
zip code text field and hit enter, the form will "submit".  
If you click enter, it posts and responds as expected... 
*/
<input type="text" value="" id="edit-zip" name="zip" />
<input type="submit" value="Save" id="edit-save" name="op">

我尝试了这个：

  $('form#my-custom-form input#edit-save').keypress(function(e) {
    if(e.which == 13) {
        e.preventDefault();
        $('input#edit-save').click();
    }
 });

Answer 1

一般来说，当任何表单元素获得焦点时按 Enter 可能会导致触发表单的提交事件。

$('form#my-custom-form').submit(...your handler function here...)

因此以与处理按钮相同的方式处理此事件

Answer 2

不要将 preventDefault() 绑定到提交按钮 click 事件，而是将其绑定到表单的 submit 事件。

$('form').submit(function(e){
e.preventDefault();
});

Answer 3

您的问题与此类似：
event.preventDefault() 不起作用Mozilla 或 IE

这就是你的解决方案

https://stackoverflow.com/a/14486639/1949475