Question

我在VIEW文件夹中有2个文件：addcustomer.php和phoneError.php。

addcustomer.php

<input  type="text" id="textHint" onKeyUp="showHint(this.value)" name="phone" placeholder="1235558888">
<span id="txtHint"></span>

<script type="text/javascript" >
    function showHint(str) {
        var base_url = <?php echo base_url(); ?>
        if (str.length == 0) {
            document.getElementById("txtHint").innerHTML = "";
            return;
        }
        else {
            var xmlhttp = new XMLHttpRequest();
            xmlhttp.onreadystatechange = function () {
                if (this.readyState == 4 && this.status == 200) {
                    document.getElementById("txtHint").innerHTML = this.responseText;
                }
            };

            // Get $p from phoneError.php
            (xmlhttp.open("GET", "phoneError.php?p=" + str, true));
            xmlhttp.send();
        }
    }
</script>

<input  type="text" id="textHint" onKeyUp="showHint(this.value)" name="phone" placeholder="1235558888">
<span id="txtHint"></span>

phoneError.php

<?php
    defined('BASEPATH') || exit('No direct script access allowed');

    $p = $_REQUEST['p']; // required

    $string_exp = "/^[0-9]{3}[0-9]{3}[0-9]{4}$/";


    if ($p == !preg_match($string_exp, $p)) {
        echo $error_message .= '<span style="color:red">Oops! The Phone you entered     does not appear to be valid.</span>';
    }
 ?>

我想以addcustomer形式将Ajax函数添加到onkeyup事件中，以检查输入的有效电话号码。我调用了addcustomer方法，并在Controller中加载了phoneError但是没有用。我不确定我为xmlhttp.open "GET"添加了正确的网址。

Answer 1

您可以将此jquery代码用于您的目的。此代码与您想要的完全相同。

$("#textHint").keyup(function () {
    $.get("phoneError.php?p=" + $(this).val(), function (data) {
        $("#txtHint").html(data);
    });
});

Answer 2

如果你使用Codeigniter，你应该知道它的基本结构。因此，将php代码放在同一控制器文件中，该文件加载您的视图并将其命名为

public function phoneError(){
    // your php code..
}

在html方面

更改span的id，因为id在同一页面中应该是唯一的。

替换

<span id="txtHint"></span>

用这个

<span id="txtResult"></span>

在输入标签中删除onKeyUp attr。所以用这个替换

<input type="text" id="textHint" name="phone" placeholder="1235558888">

js的一些变化

所以基本上你的视图文件是

addCustomer.php

<input  type="text" id="textHint"  name="phone" placeholder="1235558888" value="">
        <span id="txtResult"></span>

        <script type="text/javascript" >
                $(document).ready(function () {

                    $("#textHint").keyup(function () {
                        var str = $(this).val();
                        $.get("http://localhost/sitename/controllername/phoneError?p=" + str, function (data) {
                            $("#txtResult").html(data);
                        });
                    });
                });
            </script>

现在尝试一下。

如何在Codeigniter中获取onkeyup事件的Ajax函数

2 个答案: