如何连接按钮输入没有窗体？我希望用户能够使用输入密钥 [英] How to connect button to input without form? I want the user to be able to use the enter key

问题描述

所以我不假设在这个输入字段上使用表单标签（导致每个后端人员的bug）

我如何能够允许用户使用用户可以手动点击添加组提交按钮，或者他们可以点击标签，但他们可以't只需输入点击：（

）

表格

 < input type =文本
 id =group-codevalue =在这里键入您的组代码name =在这里键入您的组代码
 onblur =if（this.value ==''）{this .value ='在此输入您的组代码';}
 onfocus =if（this.value =='在此键入您的组代码'）{this.value ='';}
 autocomplete =off/> 
 
 <！ - < input type = submitid =btn_join_group form =group-codevalue =add group/>  - > 
  

jQuery

  $（'＃btn_join_group'）。unbind（'click'）。bind（click，function（event）{
 
 var newGroup = $（'＃group-code'） .val（）; 
 
 //将组代码发送到服务器
 WHOAT.networking.getToServerWithAjax（'/ groups / join'，newGroup，function（response）{
 var res = JSON.parse（response）; 
 
 if（res.result ==='success'）{
 notification.setStatusAndFadeStatus（response）; 
 
} else如果（res.result ==='error'）{
 notification.setStatusAndFadeStatus（response）; 
} 
}）; 
}）; 
  

解决方案

：

$ $ $ $ $（'＃group-code'）。 keyCode === 13）
sendAjax（）;
}）;

然后将你的AJAX块封装在一个名为sendAjax的函数中。这段代码没有经过测试，但这个想法应该是有效的。

So I am not suppose to use the form tag on this input field (causes bug per backend guy)

How would I be able to allow the user to use the enter key when the input is selected/active to activate the submit?

The user can manually click the add group submit button, or they can tab click, but they can't just enter to click :(

The form

<input type="text"
       id="group-code" value="Type your Group Code Here" name="Type your Group Code Here"
       onblur="if (this.value == '') {this.value = 'Type your Group Code Here';}"
       onfocus="if (this.value == 'Type your Group Code Here') {this.value = '';}"
       autocomplete="off"/>

<button class="btn" id="btn_join_group">add group</button>
<!--<input type="submit" id="btn_join_group" form="group-code" value="add group"/>-->

jQuery

$('#btn_join_group').unbind('click').bind("click", function(event) {

    var newGroup = $('#group-code').val();

    // Send Group code to server
    WHOAT.networking.getToServerWithAjax('/groups/join', newGroup, function (response) {
        var res = JSON.parse(response);

        if (res.result === 'success') {
            notification.setStatusAndFadeStatus(response);

        } else if (res.result === 'error') {
            notification.setStatusAndFadeStatus(response);
        }
    });
});

解决方案

You could add a listener to the input something like this:

$('#group-code').keypress( function (e) {
    if (e.keyCode === 13) 
        sendAjax();
});

Then wrap your AJAX block in a function called sendAjax. This code is untested, but the idea should be valid.

这篇关于如何连接按钮输入没有窗体？我希望用户能够使用输入密钥的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！