jquery ajax 在 str.rereplace 之后不起作用


jquery ajax not working after str.replace

我有一个jQuery ajax,只有在有另一个jQuery函数使用javascript的replace函数时才起作用。 为什么会这样?

注意:

  1. 这只发生在 Internet Explorer 上时。它在火狐上工作正常

  2. 我对jQuery很陌生(只学习了2天jQuery)。 所以请对我温柔:)

这是 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>

这是脚本的内容.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;
?>

更好的解决方案是防止键的默认性质,以防止不需要的键,例如

$(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>