Question

我在html中使用以下代码：

Text 1: <input class="form-control text-right" name="majorhead" id="text1" required="" type="number" /> 
<div class="result_area"></div> 

<button class="my_button" type="button" role="button">Click Me</button>

我的JS：

<script>        
    jQuery(".my_button").click(function () {
        jQuery.get(ajaxurl, {'action': 'sayhello'},
                function (msg) {
                    jQuery(".result_area").html(msg);
                });
    });
</script>

现在，当我单击按钮时，就可以实现我的结果。但是我想在输入文本中输入时达到相同的结果（我的代码将需要检查输入的每个键）。

Answer 1

尝试一下：您可以将keyup事件处理程序绑定到text1并在其中调用函数。

jQuery(document).ready(function(){
      jQuery("#text1").on("keyup",function(){  
        if($(this).val()) {
           jQuery.get(ajaxurl,{'action': 'sayhello'}, 
             function (msg) { jQuery(".result_area").html(msg);
           });
        } else { // once value deleted from text1, reset the result
          jQuery(".result_area").html('');
        }
      });
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Text 1: <input class="form-control text-right" 
        name="majorhead" id="text1" required="" type="number" /> 
<div class="result_area"></div> 
<button class="my_button" type="button" role="button">Click Me</button>

Answer 2

在文本字段中使用oninput事件。

<input type="text" oninput="scriptName">

Answer 3

您可以使用keyup或keydown事件执行操作。例如：

$(".className").on("keyup",function(){
   //Code goes here
 });

Answer 4

这是HTML

<input class="form-control" placeholder="Search Service" id="search_service" name="service" autocomplete="off" value="" type="text">

这是JS代码

jQuery( "#search_service" ).keyup( function() {

var search_ser = jQuery（this）.val（）;

var ajax_url = jQuery（'＃ajax_url_input'）。val（）;

jQuery.ajax（{

type:'POST',
url: ajax_url,
data: {
    action: 'search_service',
    search_ser: search_ser,
},
beforeSend: function(){
},
success:function(data){

    jQuery("._services_list").html(data);

}

}）;

Here is my Ajax Function in function.php

/ *搜索服务的Ajax功能。 * /

function search_service（）{

$ search_ser = $ _POST ['search_ser'];

echo $ search_ser;

die（）;

}

add_action（'wp_ajax_search_service'，'search_service'）;

add_action（'wp_ajax_nopriv_search_service'，'search_service'）;

键入时如何在输入文本中触发事件？

4 个答案: