时间戳

首页 > 解决方案 > JS ajax事件通过输入改变

javascript - JS ajax事件通过输入改变

问题描述

我想要这段代码，因为如果我进入另一个输入字段，另一个会更新

或者第二个更好的输入变化

// on click search results...
$(document).on("touchend", "#ean", function() {
  var value = $("#ean").val();
  if (value.length != 0) {
    //alert(99933);
    searchData(value);
  } else {
    $('#search-result-container').hide();
  }
});

// This function helps to send the request to retrieve data from mysql database...
function searchData(val) {
  $('#search-result-container').show();
  $('#search-result-container').html('<div><img src="app/ajax-artstk/preloader.gif" width="50px;" height="50px"> <span style="font-size: 20px;">Please Wait...</span></div>');
  $.post('app/ajax-artstk/controller.php', {
    'ean': val
  }, function(data) {

    if (data != "")
      $('#search-result-container').html(data);
    else
      $('#search-result-container').html("<div class='search-result'><div class=\"alert alert-danger\" role=\"alert\">No Result Found...</div></div>");
  }).fail(function(xhr, ajaxOptions, thrownError) { //any errors?

    alert(thrownError); //alert with HTTP error

  });
}
<form action="#" method="POST" autocomplete="off">
  <div class="form-group">
    <input type="hidden" name="ausgang">
    <div class="row">
      <div class="col-md-2">
        <label class="control-label"></label>
      </div>
    </div>
    <hr>
    <div class="row">
      <div class="col-md-2">
        <label for="ean" class="control-label">EAN</label>
      </div>

      <div class="col-md-4">
        <input type="text" name="ean" class="form-control" id="ean" value="" maxLength="100" autofocus>
        <div id="search-result-container" style="border:solid 0px #BDC7D8;display:none; "></div>
      </div>
    </div>
    <div class="row">
      <div class="col-md-2">
        <label for="stueck" class="control-label">- Stück</label>
      </div>
      <div class="col-md-2">
        <input type="text" name="stk" class="form-control" id="stk" value="" maxLength="3">
      </div>
    </div>

    <hr>

    <div class="form-group">
      <div class="col-md-offset-2 col-md-10">
        <button type="submit" class="btn btn-success">Entnehmen</button>
        <button type="reset" class="btn btn-danger">S</button>
        <!-- PRINTBUTTON -->
      </div>
    </div>
  </div>
  <!-- END form-group -->
</form>

谁能帮帮我，到目前为止，你们中的好人已经尝试了一切

我想通过 Android 和 Windows 7 Firefox 浏览器使用它。

非常感谢您为我提供的帮助我想要求发送任何解释不佳的链接

标签： javascript

解决方案

    <script>
// on click search results...
$('body').on('change', '#ean', function() { 
     var value = $("#ean").val(); 
     if (value.length != 0) {
        //alert(99933);
        searchData(value);
    } else {     
         $('#search-result-container').hide();
    }    
});

// This function helps to send the request to retrieve data from mysql database...
function searchData(val){
    $('#search-result-container').show();
    $('#search-result-container').html('<div><img src="app/ajax-artstk/preloader.gif" width="50px;" height="50px"> <span style="font-size: 20px;">Please Wait...</span></div>');
    $.post('app/ajax-artstk/controller.php',{'ean': val}, function(data){

        if(data != "")
            $('#search-result-container').html(data);
        else                
        $('#search-result-container').html("<div class='search-result'><div class=\"alert alert-danger\" role=\"alert\">No Result Found...</div></div>");
    }).fail(function(xhr, ajaxOptions, thrownError) { //any errors?

    alert(thrownError); //alert with HTTP error

    });
}

</script>

推荐阅读