2016-03-16 3 views
0

У меня есть jQuery ajax, который не работает ТОЛЬКО, когда есть еще одна функция jQuery, используя функцию javascript replace. почему это происходит?jquery ajax не работает после str.replace

примечание:

  1. это происходит только при работе в Internet Explorer. Он отлично работает на Firefox

  2. Я очень новичок в jQuery (только изучал jQuery в течение 2 дней). поэтому, пожалуйста, быть нежным со мной :)

это HTML-файл:

<?php 
session_start(); 
include('koneksi.php'); 
include('function.php'); 

unset($_SESSION['cust']); 
?> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <meta charset='utf-8'> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="styles.css"> 
    <script src="jquery-1.12.1.js"></script> 
    <script src="script.js"></script> 
    <title>CSS MenuMaker</title> 
</head> 
<body> 
       <table class="width100 padding5 border_black" id="tabel_input_master" name="tabel_input_master"> 
        <tr class="my_form"> 
         <td colspan="2"> 
          <div> 
           <div style="float:left; width:60px">Telepon</div> 
           <input 
            type="text" 
            id="cust_telp" 
            name="cust_telp" 
            style="width:200px;" 
           /> 
          </div> 
          <div id="cust_detail" name="cust_detail"> 
           <div style="float:left; width:60px">Name</div> 
           <input 
            type="text" 
            id="cust_name" 
            name="cust_name" 
            style="width:200px;" 
           /> 
          </div> 
         </td> 
        </tr> 
       </table> 

это содержание script.js:

$(document).ready(function(){ 
    $("#cust_telp").on("change",function(){ 
     var myurl = "show_cust.php?q=" + $(this).val(); 
     var request = $.ajax({ 
      url: myurl, 
      type: "GET" 
     }); 
     request.done(function(result){ 
      var cust = JSON.parse(result); 
      if (cust[0].nama == '') { 
       $("#cust_name").val(''); 
       $("#cust_name").prop('readonly',false); 
      }else{ 
       $("#cust_name").val(cust[0].name); 
       $("#cust_name").prop('readonly', true); 
      } 
     }); 
    }); 

    // when I put this script here, the ajax call on [change] event stopped working 
    $("#cust_telp").on("keyup",function(){ 
     var temp = $(this).val(); 
     temp = temp.replace(/\D/g,''); 
     $("#cust_telp").val(temp); 
    }); 
}); 

, но когда я заменить KeyUp сценарий с этим ниже, вызов ajax снова работает нормально

$("#cust_telp").on("keyup",function(){ 
     var temp = $(this).val(); 
     alert(temp); 
    }); 

вот файл show_cust.php

<?php 
session_start(); 
include('koneksi.php'); 
include('function.php'); 

$q = (isset($_GET['q'])) ? $_GET['q'] : ''; 
$outp = ''; 
unset($cust); 
$cust = array(); 

if ($q != '') { 
    $sql = "select * from customer where telp1 = '".$q."' or telp2 = '".$q."'"; 
    $query = mysqli_query($link, $sql); 
    $cust = mysqli_fetch_array($query); 

    unset($_SESSION['cust']); 
    $_SESSION['cust'] = $cust; 

    $outp = "["; 
    $outp .= '{"name":"' . $cust["name"] . '",'; 
    $outp .= '"address":"' . $cust["address"] . '"}'; 
    $outp .= "]"; 
} 

echo $outp; 
?> 
+0

Я думаю, что происходит is, событие изменения запускается, когда значение совершается, поэтому на этом этапе он проверяет, совпадает ли ранее зафиксированное значение с текущим значением, если поэтому событие изменения не запускается, но поскольку мы устанавливаем значение программно он обновляется в коммандном свойстве, поэтому, когда происходит размытие, нет разницы между фиксированным и текущим значением (не отправлено в качестве ответа, так как я не могу найти справочный материал) –

+0

У вас также есть закрывающий тег и правильно? –

ответ

1

Лучшим решением будет предотвратить характер по умолчанию ключей, чтобы предотвратить нежелательные ключи как

$(document).ready(function() { 
 
    $("#cust_telp").on("change", function() { 
 
    snippet.log('changed: ' + this.value) 
 
    }); 
 

 
    // when I put this script here, the ajax call on [change] event stopped working 
 
    $("#cust_telp").on("keypress", function(e) { 
 
    return e.which >= 48 && e.which <= 57; 
 
    }); 
 
});
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 --> 
 
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table class="width100 padding5 border_black" id="tabel_input_master" name="tabel_input_master"> 
 
    <tr class="my_form"> 
 
    <td colspan="2"> 
 
     <div> 
 
     <div style="float:left; width:60px">Telepon</div> 
 
     <input type="text" id="cust_telp" name="cust_telp" style="width:200px;" /> 
 
     </div> 
 
     <div id="cust_detail" name="cust_detail"> 
 
     <div style="float:left; width:60px">Name</div> 
 
     <input type="text" id="cust_name" name="cust_name" style="width:200px;" /> 
 
     </div> 
 
    </td> 
 
    </tr> 
 
</table>

+0

https://jsfiddle.net/arunpjohny/fybnsoe4/ –

+0

большое спасибо! часть нажатия клавиши сделала трюк даже лучше, чем заменить, потому что при замене ключ ввода все еще отображается в течение секунды секунды. Мне не нужно использовать объект snippet atm, хотя .. – dapidmini

+0

@dapidmini no .., который используется только для демонстрации того, что событие изменения активировано –