简体   繁体   English

更新PHP中的字符串而无需刷新页面,AJAX类型的函数

[英]Update string in a PHP without page refresh, AJAX type function

I would like to see if there's a way to perform similar task in PHP. 我想看看是否有一种方法可以在PHP中执行类似的任务。 I utilized javascript to update the string in the 'boldStuff' id with another string, in this case the user's name, when submit button is clicked. 我使用javascript用另一个字符串更新“ boldStuff” ID中的字符串,在这种情况下,当单击“提交”按钮时,为用户名。 The important concept is that the page or section containing the 'boldStuff' updates without the page refreshing. 重要的概念是,包含“ boldStuff”的页面或部分会更新而不会刷新页面。 Basically, i would like to perform a similar function in PHP without the page refreshing everytime someone clicks the submit button. 基本上,我想在PHP中执行类似的功能,而不必每次有人单击“提交”按钮时刷新页面。 Any help would be appreciated. 任何帮助,将不胜感激。

<script type="text/javascript">

function displayMessage(firstName, lastName) {
document.getElementById('boldStuff').innerHTML = firstName + " " + lastName; //prints

}
</script>

<p>Welcome to my website, <b id='boldStuff'>dude</b> </p> 
</br>

<div id="hg">

<form>
First name:
<input type="input" name="yourName" /> </br>
First name:
<input type="input" name="yourLast" /> </br>
<input
type="button"
onclick="javascript:displayMessage(form.yourName.value, form.yourLast.value)"
value="Display Message" />
</form>
</div>
</body>
</html>

PHP runs on the server, not in the browser. PHP在服务器上运行,而不在浏览器中运行。 There is no way for it to interact directly with a page loaded in a browser. 它无法直接与浏览器中加载的页面进行交互。 PHP can generate a page and send it to the browser to display, but that's the end of the story. PHP可以生成一个页面并将其发送到浏览器进行显示,但这只是故事的结尾。 If you want to manipulate the page without reloading, you need a client-side technology. 如果要在不重新加载的情况下操作页面,则需要一种客户端技术。 This means Javascript in 99.9% of cases. 这意味着在99.9%的情况下使用Javascript。

If you need something from the server, you can use Javascript to fetch the result of a PHP script and insert it on your page without reloading but, even though PHP can be involved, all of the client-side actions will be performed by Javascript. 如果您需要服务器上的某些东西,则可以使用Javascript来获取PHP脚本的结果,然后将其插入页面中而无需重新加载,但是即使PHP涉及到,所有客户端操作都将由Javascript执行。

your html file should be simular to: 您的html文件应类似于:

<html>
<head>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" >
$(document).ready(function(){
    $("form#submit").submit(function() {
    // we want to store the values from the form input box, then send via ajax below
    var fname     = $('#fname').attr('value');
    var lname     = $('#lname').attr('value');
    $.ajax({
            type: "POST",
            url: "ajax.php",
            data: "fname="+ fname +"&amp; lname="+ lname,
            success: function(){
                $('form#submit').hide(function(){$('div.success').fadeIn();});

            }
        });
    return false;
    });

});
</script>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1255">
<title>Insert title here</title>
</head>
<body>
<form id="submit" method="post">
<fieldset><legend>Enter Information</legend> 
<label for="fname">Client First Name:</label>
 <input id="fname" class="text" type="text" name="fname" size="20" />
  <label for="lname">Client Last Name:</label> 
  <input id="lname" class="text" type="text" name="lname" size="20" /> 
  <button class="button positive">  Add Client </button>
  </fieldset>
</form>
<div class="success" style="display: none;">Client has been added.</div>
</body>
</html>

and ajax.php 和ajax.php

<?php

    include ("../../inc/config.inc.php");

    // CLIENT INFORMATION
    $fname        = htmlspecialchars(trim($_POST['fname']));
    $lname        = htmlspecialchars(trim($_POST['lname']));

    $addClient  = "INSERT INTO clients (fname,lname) VALUES ('$fname','$lname')";
    mysql_query($addClient) or die(mysql_error());

?>

I copy this code from [enter link description here][1] 我从[在此处输入链接说明] [1]复制了此代码

[1]: http://www.ryancoughlin.com/2008/11/04/use-jquery-to-submit-form/ and I tested. [1]: http : //www.ryancoughlin.com/2008/11/04/use-jquery-to-submit-form/ ,我进行了测试。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM