PHP與Web頁面的交互如何實(shí)現(xiàn)-創(chuàng)新互聯(lián)

本篇文章為大家展示了PHP與Web頁面的交互如何實(shí)現(xiàn)，代碼簡明扼要并且容易理解，絕對(duì)能使你眼前一亮，通過這篇文章的詳細(xì)介紹希望你能有所收獲。

成都創(chuàng)新互聯(lián)公司長期為數(shù)千家客戶提供的網(wǎng)站建設(shè)服務(wù)，團(tuán)隊(duì)從業(yè)經(jīng)驗(yàn)10年，關(guān)注不同地域、不同群體，并針對(duì)不同對(duì)象提供差異化的產(chǎn)品和服務(wù)；打造開放共贏平臺(tái)，與合作伙伴共同營造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為麻章企業(yè)提供專業(yè)的成都網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)，麻章網(wǎng)站改版等技術(shù)服務(wù)。擁有十年豐富建站經(jīng)驗(yàn)和眾多成功案例,為您定制開發(fā)。

前言

這篇筆記記錄的是Web表單的相關(guān)操作，Web表單主要用來在網(wǎng)頁中發(fā)送數(shù)據(jù)到服務(wù)器。比如在日常開發(fā)中，提交注冊時(shí)需要提交表單，表單從客戶端傳送到服務(wù)器，經(jīng)過服務(wù)器處理后，再將用戶所需要的信息傳遞回客戶端，進(jìn)而實(shí)現(xiàn)PHP與Web表單的交互。

表單

使用元素，并在其中插入相關(guān)的表單元素，即可創(chuàng)建一個(gè)表單。

表單結(jié)構(gòu)：


…      //省略插入的表單元素

form標(biāo)記的屬性如下表：

form標(biāo)記的屬性	說明
name	表單名稱
method	設(shè)置表單的提交方式，GET或者POST方法
action	紙箱處理該表單頁面的URL
enctype	設(shè)置表單內(nèi)容的編碼方式
target	設(shè)置返回信息的顯示方式

表單（form）由表單元素組成。常用的表單元素有以下幾種標(biāo)記：輸入域標(biāo)記、選擇域標(biāo)記等。</pre><p><strong>輸入域標(biāo)記<input></strong></p><p>輸入域標(biāo)記<input>是表單中最常用的標(biāo)記之一。常用的文本框、按鈕、單選按鈕、復(fù)選框等構(gòu)成了一個(gè)完整的表單。<br/>語法格式如下：</p><pre><form>
<input name="file_name" type="type_name">
</form></pre><p>參數(shù)name是指輸入域的名稱，參數(shù)type是指輸入域的類型。在<input type="">標(biāo)記中一共提供了10種類型的輸入?yún)^(qū)域，用戶所選擇使用的類型由type屬性決定。</p><p>下面舉幾個(gè)type屬性例子:</p><p><strong>1、text</strong></p><pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"
 />
<title>PHP語言基礎(chǔ)</title>

</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
 <tr bgcolor="#FFCC33">
  <td width="103" height="25" align="right">文本框：</td>
  <td height="25" align="left"><input name="user" type="text" value="Bill" id="user" size="20" maxlength="100"></td>
 </tr>
</form>
<?php
header("Content-Type:text/html;  charset=gb2312");
?>
</body>
</html></pre><p>運(yùn)行效果：</p><p><img src="/upload/otherpic8/11147.jpg" alt="PHP與Web頁面的交互如何實(shí)現(xiàn)"></p><blockquote><p>name為文本框的名稱，value是文本框的默認(rèn)值，size為文本框的寬度，maxlength為文本框的大輸入字符數(shù)，可以通過id獲取文本框的值。</p></blockquote><p><strong>2、password</strong></p><pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"
 />
<title>PHP語言基礎(chǔ)</title>

</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
 <tr bgcolor="#FFCC33">
  <td width="103" height="25" align="right">密碼域：</td>
  <td height="25" align="left">
  <input name="pwd" type="password" value="1234567" id="password" size="20" maxlength="100">
  </td>
 </tr>
</form>
<?php
header("Content-Type:text/html;  charset=gb2312");
?>
</body>
</html></pre><p>運(yùn)行結(jié)果：</p><p><img src="/upload/otherpic8/11148.jpg" alt="PHP與Web頁面的交互如何實(shí)現(xiàn)"></p><blockquote><p>密碼域，用戶在該文本框中輸入的字符將被替換為*顯示，以起到保密作用。</p></blockquote><p><strong>3、file</strong></p><pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"
 />
<title>PHP語言基礎(chǔ)</title>

</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
 <tr bgcolor="#FFCC33">
  <td width="103" height="25" align="right">文件域：</td>
  <td height="25" align="left">
  <input name="file" type="file" enctype="multipart/form-data" id="upfile" size="20" maxlength="200">
  </td>
 </tr>
</form>
<?php
header("Content-Type:text/html;  charset=gb2312");
?>
</body>
</html></pre><p>運(yùn)行結(jié)果：</p><p><img src="/upload/otherpic8/11149.jpg" alt="PHP與Web頁面的交互如何實(shí)現(xiàn)"></p><blockquote><p>文件域，當(dāng)文件上傳時(shí)，可以用來打開一個(gè)模式窗口來選擇文件。然后將文件通過表單上傳到服務(wù)器，上傳文件時(shí)需要指明表單的屬性enctype=”multipart/form-data”才可以實(shí)現(xiàn)上傳功能。</p></blockquote><p><strong>4、image</strong></p><pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"
 />
<title>PHP語言基礎(chǔ)</title>

</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
 <tr bgcolor="#FFCC33">
  <td width="103" height="25" align="right">圖像域：</td>
  <td height="25" align="left">
  <input name="image" type="image" src="btn__details_praise_selected.png" id="img" width="40" height="40" border="0">
  </td>
 </tr>
</form>
<?php
header("Content-Type:text/html;  charset=gb2312");
?>
</body>
</html></pre><p>運(yùn)行效果：</p><p><img src="/upload/otherpic8/11150.jpg" alt="PHP與Web頁面的交互如何實(shí)現(xiàn)"></p><blockquote><p>圖像域是指可以用在提交按鈕位置上的圖片，這副圖片具有按鈕的功能</p></blockquote><p><strong>5、radio</strong></p><pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"
 />
<title>PHP語言基礎(chǔ)</title>

</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
 <tr bgcolor="#FFCC33">
  <td width="103" height="25" align="right">單選按鈕：</td>
  <td height="25" align="left">
    <input name="sex" type="radio" value="1" checked>男
    <input name="sex" type="radio" value="0" >女
  </td>
 </tr>
</form>
<?php
header("Content-Type:text/html;  charset=gb2312");
?>
</body>
</html></pre><p>運(yùn)行結(jié)果：</p><p><img src="/upload/otherpic8/11151.jpg" alt="PHP與Web頁面的交互如何實(shí)現(xiàn)"></p><blockquote><p>單選按鈕，用于設(shè)置一組選擇項(xiàng)，用戶只能選擇一項(xiàng)。checked屬性用來設(shè)置該單選按鈕默認(rèn)被選中。</p></blockquote><p><strong>6、checkbox</strong></p><pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"
 />
<title>PHP語言基礎(chǔ)</title>

</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
 <tr bgcolor="#FFCC33">
  <td width="103" height="25" align="right">復(fù)選框：</td>
  <td height="25" align="left">
    <input name="checkbox" type="checkbox" value="1" checked>蘋果
    <input name="checkbox" type="checkbox" value="1" checked>小米
    <input name="checkbox" type="checkbox" value="1" >三星
  </td>
 </tr>
</form>
<?php
header("Content-Type:text/html;  charset=gb2312");
?>
</body>
</html></pre><p>運(yùn)行結(jié)果：</p><p><img src="/upload/otherpic8/11152.jpg" alt="PHP與Web頁面的交互如何實(shí)現(xiàn)"></p><blockquote><p>復(fù)選框，允許用戶選擇多個(gè)選擇項(xiàng)。checked屬性用來設(shè)置該復(fù)選框默認(rèn)被選中。</p></blockquote><p><strong>7、submit</strong></p><pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"
 />
<title>PHP語言基礎(chǔ)</title>

</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
 <tr bgcolor="#FFCC33">
  <td width="103" height="25" align="right">提交按鈕：</td>
  <td height="25" align="left">
    <input name="submit" type="submit" value="提交">
  </td>
 </tr>
</form>
<?php
header("Content-Type:text/html;  charset=gb2312");
?>
</body>
</html></pre><p>運(yùn)行結(jié)果：</p><p><img src="/upload/otherpic8/11153.jpg" alt="PHP與Web頁面的交互如何實(shí)現(xiàn)"></p><blockquote><p>將表單的內(nèi)容提交到服務(wù)器端</p></blockquote><p><strong>8、reset</strong></p><pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"
 />
<title>PHP語言基礎(chǔ)</title>

</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
 <tr bgcolor="#FFCC33">
  <td width="103" height="25" align="right">重置按鈕：</td>
  <td height="25" align="left">
    <input name="reset" type="reset" value="重置">
  </td>
 </tr>
</form>
<?php
header("Content-Type:text/html;  charset=gb2312");
?>
</body>
</html></pre><p>運(yùn)行結(jié)果：</p><p><img src="/upload/otherpic8/11154.jpg" alt="PHP與Web頁面的交互如何實(shí)現(xiàn)"></p><blockquote><p>清除與重置表單內(nèi)容，用于清除表單中所有文本框的內(nèi)容，并使選擇菜單項(xiàng)恢復(fù)到初始值。</p></blockquote><p><strong>9、button</strong></p><pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"
 />
<title>PHP語言基礎(chǔ)</title>

</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
 <tr bgcolor="#FFCC33">
  <td width="103" height="25" align="right">普通按鈕：</td>
  <td height="25" align="left">
    <input name="button" type="button" value="注冊">
  </td>
 </tr>
</form>
<?php
header("Content-Type:text/html;  charset=gb2312");
?>
</body>
</html></pre><p>運(yùn)行結(jié)果：</p><p><img src="/upload/otherpic8/11155.jpg" alt="PHP與Web頁面的交互如何實(shí)現(xiàn)"></p><blockquote><p>按鈕可以激發(fā)提交表單的動(dòng)作，可以在用戶需要修改表單時(shí)，將表單恢復(fù)到初始的狀態(tài)，還可以依照程序的需要發(fā)揮其他作用。</p></blockquote><p><strong>10、hidden</strong></p><pre><input type="hidden" name="信息"></pre><blockquote><p>隱藏域，用于在表單中以隱含方式提交變量值。隱藏域在頁面中對(duì)于用戶是不可見的，添加隱藏域的目的在于通過隱藏的方式收集或者發(fā)送信息。</p><br/><br/></blockquote><p><strong>選擇域標(biāo)記<select>和<option></strong></p><p>通過選擇域標(biāo)記<select>和<option>可以建立一個(gè)列表或者菜單。菜單的使用是為了節(jié)省空間，正常狀態(tài)下只能看到一個(gè)選項(xiàng)，單擊右側(cè)的下三角按鈕打開菜單后才能看到全部的選項(xiàng)。列表可以顯示一定數(shù)量的選項(xiàng)，如果超出了這個(gè)數(shù)量，會(huì)自動(dòng)出現(xiàn)滾動(dòng)條，瀏覽者可以通過拖動(dòng)滾動(dòng)條來查看各選項(xiàng)。</p><p>語法格式如下：</p><pre><select name="name" size="value" multiple>
<option value="value" selected>選項(xiàng)1</option>
<option value="value">選項(xiàng)2</option>
<option value="value">選項(xiàng)3</option>
…
</select></pre><blockquote><p>參數(shù)name表示選擇域的名稱；參數(shù)size表示列表的行數(shù)；參數(shù)value表示菜單選項(xiàng)值；參數(shù)multiple表示以菜單方式顯示數(shù)據(jù)，省略則以列表方式顯示數(shù)據(jù)。</p></blockquote><p><strong>1、列表方式</strong></p><pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"
 />
<title>PHP語言基礎(chǔ)</title>

</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
 <tr bgcolor="#FFCC33">
  <td width="103" height="25" align="right">喜歡哪種編程語言：</td>
  <td height="25" align="center" >
    <select name="name" id="code">
      <option value="1" selected>Java語言</option>
      <option value="2">C語言</option>
      <option value="3">JS語言</option>
      <option value="4">PHP語言</option>
    </select>
  </td>
 </tr>
</form>
<?php
header("Content-Type:text/html;  charset=gb2312");
?>
</body>
</html></pre><p>運(yùn)行結(jié)果：</p><p><img src="/upload/otherpic8/11156.jpg" alt="PHP與Web頁面的交互如何實(shí)現(xiàn)"></p><blockquote><p>下拉列表框，通過選擇域標(biāo)記<select>和<option>建立一個(gè)列表，列表可以顯示一定數(shù)量的選項(xiàng)，如果超出了這個(gè)數(shù)量，會(huì)自動(dòng)出現(xiàn)滾動(dòng)條，瀏覽者可以通過拖動(dòng)滾動(dòng)條來查看各選項(xiàng)。selected屬性用來設(shè)置該菜單時(shí)默認(rèn)被選中。</p></blockquote><p><strong>2、菜單方式</strong></p><pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"
 />
<title>PHP語言基礎(chǔ)</title>

</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
 <tr bgcolor="#FFCC33">
  <td width="103" height="25" align="right">喜歡哪種編程語言：</td>
  <td height="25" align="center" >
    <select name="name" id="code" multiple>
      <option value="1" selected>Java語言</option>
      <option value="2">C語言</option>
      <option value="3">JS語言</option>
      <option value="4">PHP語言</option>
    </select>
  </td>
 </tr>
</form>
<?php
header("Content-Type:text/html;  charset=gb2312");
?>
</body>
</html></pre><p>運(yùn)行結(jié)果：</p><p><img src="/upload/otherpic8/11157.jpg" alt="PHP與Web頁面的交互如何實(shí)現(xiàn)"></p><pre>> multiple屬性用于菜單列表"<select>"標(biāo)記中，指定該選項(xiàng)的用戶可以使用Shift和Ctrl鍵進(jìn)行多選</pre><p><strong>文字域標(biāo)記<textarea></strong></p><p>文字域標(biāo)記<textarea>用來制作多行的文字域，可以在其中輸入更多的文本。</p><p>語法格式如下：</p><pre><textarea name="name" rows=value cols=value value="value" warp="value">
  …文本內(nèi)容

參數(shù)name表示文字域的名稱；rows表示文字域的行數(shù)；cols表示文字域的列數(shù)（這里的rows和cols以字符為單位）；value表示文字域的默認(rèn)值，warp用于設(shè)定顯示和送出時(shí)的換行方式，值為off表示不自動(dòng)換行，值為hard表示自動(dòng)硬回車換行，換行標(biāo)記一同被發(fā)送到服務(wù)器，輸出時(shí)也會(huì)換行，值為soft表示自動(dòng)軟回車換行，換行標(biāo)記不會(huì)被發(fā)送到服務(wù)器，輸出時(shí)仍然為一列。

例如：





PHP語言基礎(chǔ)




 
  請(qǐng)寫下你的留言：
  
    留言...

運(yùn)行結(jié)果：

PHP與Web頁面的交互如何實(shí)現(xiàn)

上述內(nèi)容就是PHP與Web頁面的交互如何實(shí)現(xiàn)，你們學(xué)到知識(shí)或技能了嗎？如果還想學(xué)到更多技能或者豐富自己的知識(shí)儲(chǔ)備，歡迎關(guān)注創(chuàng)新互聯(lián)-成都網(wǎng)站建設(shè)公司行業(yè)資訊頻道。

當(dāng)前標(biāo)題：PHP與Web頁面的交互如何實(shí)現(xiàn)-創(chuàng)新互聯(lián)
本文網(wǎng)址：http://weahome.cn/article/dcopis.html

真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

PHP與Web頁面的交互如何實(shí)現(xiàn)-創(chuàng)新互聯(lián)

其他資訊

網(wǎng)站制作

企業(yè)服務(wù)

網(wǎng)站建設(shè)

服務(wù)器托管