關於js表單調用顯示php數據（php與html表單的交互）

本文目錄一覽：

• 1、js/jquery如何這樣調用php？
• 2、html調用js，js再調用php，然後在網頁顯示調用結果
• 3、js數組如何調用php數據庫數組循環顯示
• 4、html如何通過js腳本調用顯示一個php頁面的內容？
• 5、js中使用php數據問題

js/jquery如何這樣調用php？

js/jquery調用php一般是用AjAx方式來調用的。

首先確認需要調用的php文件，可以是絕對路徑，也可以是相對路徑

這裡以Jquery為例子解釋上面的問題

如下圖就是jquery的實現代碼，下圖的url就是需要請求的php地址；

如下圖就是php代碼的數據提供接口，最後使用ajax的數據格式返回給js端，這樣就實現了一次，php的調用。

html調用js，js再調用php，然後在網頁顯示調用結果

建議使用jquery

假設你右邊是一個div標籤，給他設置一個id值，比如id=”show”

給查詢兩個字加一個標籤，比如a標籤：a href=”#” class=”chaxun”查詢/a

然後寫jquery的ajax代碼：

$(‘a.chaxun’).click(function(){//class=」chaxun”的a標籤的點擊事件

var bianhao, minzhi;//聲明2個變量

biaohao = $(‘#bianhao’).val();//取得文本框id為bianhao的值

mingzhi = $(‘#mingzi’).val();//同理

$(‘div#show’).load(‘chaxun.php?bianhao=’ +bianhao +’mingzhi=’ + mingzhi);

});

最後在你的chaxun.php中，和平時寫代碼一樣就行了

?php

$bianhao = $_GET[‘bianhao’];

$mingzhi = $_GET[‘mingzhi’];

//接着就是你的數據庫查詢

echo $Data;//輸出你的數據庫查詢結果即可

js數組如何調用php數據庫數組循環顯示

思路：php是服務器端語言，自在服務器端運行，運行完以後吧結果以HTML代碼的形式推到你的瀏覽器；JS直接在你的瀏覽器上運行。應該在PHP語句里直接ECHO(輸出) js代碼，把數據傳給JS數組，然後再用js函數處理。

?php

include_once(“conn.php”);

$sql = mysql_query(“select username from user where bmid = 9”);

$i =1;

while($row = mysql_fetch_array($sql))

{

echo 「scriptdataSource = “.$row[‘username’].”/script”;

}

?

具體操作請自行調試

html如何通過js腳本調用顯示一個php頁面的內容？

舉一個簡單的例子來說明:

如在頁面a.html中用下面這句調用:

script type=”text/javascript” src=”b.php?action=test”/script

script type=”text/javascript”

alert(jstext);

/script

在b.php中有這樣一段PHP代碼:

? $action=$_GET[‘action’]; //echo “var jstext=’$action'”; //輸出一句JS語句,生成一個JS變量,並賦顛值為PHP變量 $action的值 //echo “var jstext=’aa'”; echo “var jstext=”.”‘$action'”; ?

當執行a.html文件時,就會調用b.php文件,並將b.php文件的輸出作為JS語句來執行,所以此處會彈出一個提示框,內容為JS變量jstext的值,也就是在PHP文件中賦給jstext的值.

小結:

在HTML里用JS 調用文件的方式調PHP文件,則PHP文件的輸出將會被調用頁作為JS的代碼來用.

2 php調用js中的值

在z.php頁面中有這樣一段代碼：

script type=”text/javascript” var url=”aaaa*”; /script ? $key=”script type=text/javascriptdocument.write(url)/script”; echo $key; ?

3 php調用js中的方法(函數)

script type=”text/javascript” function test() { var t1=3; t1 = t1+2; alert(t1); //return t1; } /script

?php echo “script type=’text/javascript’test();/script”; ?

4 JS調用PHP變量

（1）

?php

$userId=100;

? script

var userId;

userId=document.getElementByIdx_x_x_x(“userId”).value;

alert (userId);

/script

input type=”text” name=”userId” id=”userId” value=”?php echo $userId; ?”

（2）

?php

$url = ‘變化的網址’; //定義變量

?

script type=”text/javascript”

//js調用php變量

var ds =”?php echo $url?” ; //賦值 alert(ds); //輸出效果 /script

5 ——————————-

script language=”JavaScript” !–

var Y=?php echo date(‘Y’)?,M=?php echo date(‘n’)?,D=?php echo date(‘j’)?;

—

/script

6 自己寫的js和php互相調用

1.php內容：

?php

//echo “script LANGUAGE=’javascript’alert(‘$php變量’);/script”; //最簡單的php調用js

//echo “a href=#img width=50 src=’$fruit_pic_array[$i]’ onMouseOver=』javascript:a();『/a”;

//echo “a href=’3.php’aaaa/a”; //php中超鏈接

//echo “script type=’text/javascript’ language=’javascript’phpmake(‘PHP建站學習筆記網’);/script”; //有時候需要在PHP執行過程中，需要調用JavaScript自定義函數(驗證時出錯)

echo “function ok(msg){alert(msg);}”;

?

HTML

HEAD

TITLE php調用js文件的好辦法/TITLE

/HEAD

BODY

!–js調用php中定義的js–

scrīpt language=”javascrīpt” type=”text/javascrīpt” src=”1.php”/scrīpt

scrīpt

ok(“aaaaaa!”);

/scrīpt

/script

/BODY

/HTML

2.php內容：

!–js調用php–

?php

$userId=100;

?

script

var userId;

userId=document.getElementByIdx_x(“userId”).value;

alert (userId);

/script

input type=”text” name=”userId” id=”userId” value=”?php echo $userId; ?”

!–js調用php–

?php

if($_GET[“action”]==”ok”)

{

echo “I’m OK!”;

}

else

{

echo “I’m not OK!”;

}

?

SCRIPT Language = “JavaScript”

function func()

{

if(confirm(“Are you OK with this?”))

{

this.location = “ok.php?action=ok”;

}

else

{

this.location = “ok.php?action=cancel”;

}

}

/SCRIPT

html

head

/head

body

a href=”#” href=”#” onClick=”javascript:func();”Please Click/a

/body

/html

!–js調用php–

html

head

script

function isMail(PostString)

{

re=/\w*/

if(re.test(PostString))

{

return true;

}

else

{

return false;

}

}

function test(){

if (isMail(?php echo $email?))

{document.write(“?php echo “N”;?”);}

else

{document.write(‘?php echo ‘Y’;?’);}

}

/script

/head

body

?php

$email=”aa”;

?

input type=button value=click onclick= ‘test() ‘

/body

/html

!–php中含有js代碼–

?php

echo ”

script language=javascript

function test(){

alert( ‘hello ‘);

}

/script “;

?

input type=button value=click onclick= ‘test() ‘

js中使用php數據問題

innerHTML一般賦值的是字符串（如果是數字，就沒有必要html， 使用innerText即可）

既然是字符串，那就有引號（單引號雙引號都可），所以，應該作如下改正：

h4[1].innerHTML+=’?php echo $_GET[‘zshixm’];?’;