Question

编辑** 试着让这个更清楚......

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

当我在文本区域并点击“输入”时，它会提交给自己，而不是通过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表单（必须输入type =“submit”...不能使用“button”）。当我点击它时，它按预期工作，因为它实际上并没有“提交”信息，但是当我按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() not working in Mozilla or IE
这是你的解决方案
https://stackoverflow.com/a/14486639/1949475

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

3 个答案: