如何使用AJAX在页面内调用PHP函数 - javascript

我写了一个php函数，如果被PHP页面单独调用，它会完美地完成工作。但是我想将此功能集成到程序中，并希望在单击按钮时调用它。
我的PHP函数是

function adddata($mobile){
    // outside of this function, another database is already selected to perform different
    //tasks with program's original database, These constants are defined only within this
    //this function to communicate another database present at the same host
    define ("HOSTNAME","localhost");
    define ("USERNAME","root");
    define ("PWD","");
    define ("DBNAME","budgetbot");

    // link to mysql server
    if (!mysql_connect(HOSTNAME,USERNAME,PWD)) {
        die ("Cannot connect to mysql server" . mysql_error() );
    }

    // selecting the database
    if (!mysql_select_db(DBNAME)) {
        die ("Cannot select database" . mysql_error() );
    }

    //inserting phone number into database
    $query = "INSERT INTO `verify_bot` (phone_number) values('".$mobile."')";
    if(!mysql_query($query)){
       die( mysql_error() );
    }

    // wait for 2 seconds after adding the data into the database
    sleep(2);

    $query = "SELECT * FROM `verify_bot` WHERE phone_number = ".$mobile;
    $result = mysql_query($query) or die( mysql_error() );
    // if more than one records found for the same phone number
    if(mysql_num_rows($result) > 1){
        while($row = mysql_fetch_assoc($result)){
            $data[] = $row['response'];
        }
        // return an array of names for the same phone numbers
        return $data;
    }else{
        // if only one record found
        $row = mysql_fetch_assoc($result);
        $response = $row['response'];
        return $response;
    }
    // end of function
}

HTML代码写为

<form action="self_page_address_here" method="post" accept-charset="utf-8" class="line_item_form" autocomplete="off">
    <input type="text" name="mobile_number" value="" placeholder="(000) 000-0000" class="serial_item" size="20" id="serialnumber_1" maxlength="10" />
    <button id="verify" class="btn btn-primary">Verify</button>
    <button id="cname" class="btn btn-primary"><!-- I want to print return value of the php function here --></button>
</form>

我想调用此函数，并通过ajax / jquery将返回值分配给javascript变量。
我要做的代码是...

<script type="text/javascript" language="javascript">
    $('#verify').click(function(){
        var value = $( ".serial_item" ).val();
        //I have some knowledge about php but I am beginner at ajax/jquery so don't know what is happening below. but I got this code by different search but doesn't work            
        $.ajax({
            url  : "add_data.php&f="+value,
            type : "GET"
            success: function(data){
                document.getElementById("cname").innerHTML = data;
            }
        });  
    });
</script>

我想分享一下，上面的javascript代码位于documnet.ready(){}之外
范围
任何帮助将非常感激。
谢谢

参考方案

由于您的<button>元素没有type="button"属性，因此应该使用常规的POST请求提交表单。

您应该在按钮上使用type="button"属性，或者使用event.preventDefault()阻止默认表单提交：

$('#verify').click(function(event){
    event.preventDefault();
    var value = $( ".serial_item" ).val();           
    $.ajax({
        // there's a typo, should use '?' instead of '&':
        url  : "add_data.php?f="+value,
        type : "GET",
        success: function(data){
            $("#cname").html(data);
        }
    });  
});

[EDIT]然后在add_data.php中（如果您在同一页面上调用AJAX，请将此代码放在顶部，以便在此之前不呈现HTML）：

if(isset($_GET['f'])){
    // call your function:
    $result = adddata(trim($_GET['f']));
    // if returned value is an array, implode it:
    echo is_array($result) ? implode(', ', $result) : $result;

    // if this is on the same page use exit instead of echo:
    // exit(is_array($result) ? implode(', ', $result) : $result);
}

确保您转义$query上的值。

PHP Javascript更改浏览器后退按钮行为Laravel - javascript

我知道有各种各样的线程要求几乎相同的要求，但似乎没有一个真正满足我的需求。在我的网站上，我实现了搜索表单。一个简单的表单，其中包含一个名为searchQuery的输入字段和一个提交按钮。表单通过POST方法发送。我正在使用Laravel btw。。然后将搜索结果从控制器加载到视图中。这些在表中显示。现在来了有趣的部分：找到的元素是可单击的，并且您进入有关该元…

Javascript-从当前网址中删除查询字符串 - javascript

单击提交按钮后，我需要从网址中删除查询字符串值。我可以用jQuery做到这一点吗？当前网址：siteUrl/page.php?key=value 页面提交后：siteUrl/page.php 实际上，我已经从另一个带有查询字符串的页面着陆到当前页面。我需要在页面首次加载时查询字符串值以预填充一些详细信息。但是，一旦我提交了表格，我就需要删除查询字符串值。我已…

使用JS和PHP更改弹出窗口背景图像 - javascript

我有一个JS函数：function zoom(now) { document.getElementById("popup").style.display = "block"; document.getElementById("photos").style.backgroundImage = …

执行onclick时获得意外令牌 - javascript

我正在使用onclick事件从PHP调用JS函数。这是我的代码：我在一个函数中，因此我需要通过PHP来完成它，因为然后我会返回：$html = '<input type="checkbox" checked value="1" id="setGetSku" name="se…

PHP json_encode数组到javascript关联数组 - javascript

我有一些从PHP中读取的mysqli列。它正在完美地获取和回显。$results = mysqli_fetch_assoc(mysqli_query($conn, $querystring)); echo json_encode($results); //$results = {"title":"Sea Shells"…