PIXNET Logo登入

互聯網 - 大數據

跳到主文

本部落格為互聯網熱門頭條訊息管理中心

部落格全站分類:生活綜合

  • 相簿
  • 部落格
  • 留言
  • 名片
  • 3月 09 週四 201720:30
  • 會話用法 和留言板例題


文章出處
先來說一下留言例題
首先要在數據庫建這樣一張表備用:
之前都學過登錄注冊頁面,在這里還需要一個登錄頁面
簡單的建一個
<!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=utf-8" />
<title>無標題文檔</title>
</head>
<body>
<h1>開發部內部留言板</h1>
<form action="denglu1.php" method="post">
<div>用戶名:<input type="text" name="yh" /></div>
<br />
<div>口令:<input type="text" name="mm" /></div>
<br />
<div><input type="submit" value="登錄" /><input type="reset" value="復位" /></div>
</form>
</body>
</html>

這里的復位用的是以前學過的一個重置按鈕
要想完成登錄還需要一個頁面,就是上面表單提交的頁面,是個純php頁面
<?php
session_start(); //用的session來儲存數據
include("./fengzhuang.php");
$db = new fengzhuang();
$yh = $_POST["yh"];
$mm = $_POST["mm"];
$sql = "select mm from zhuce where yh = '{$yh}'";
$attr = $db->Query($sql);
$mima = $attr[0][0];
if(!empty($mm) && $mm==$mima) //這里是密碼非空,并且密碼等于用于輸入的密碼
{
$_SESSION["yh"] = $yh; //session中存的用戶名等于用戶輸入的用戶名
header("location:liuyan.php");
}
else
{
echo "登錄失敗!";
}

如果用戶登錄成功的話,會直接打到主頁面
下面再來做一下主頁面
<!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=utf-8" />
<title>無標題文檔</title>
</head>
<?php
session_start(); //可以控制登陸
//echo $_SESSION["yh"];

if(empty($_SESSION["yh"])) //判斷如果用戶名為空,則直接打到登錄頁面
{
header("location:denglu.php");
exit;
}
/*$yh = $_SESSION["yh"];
include("./fengzhuang.php");
$db = new fengzhuang();
$sql= "select xm from zhuce where yh='{$yh}'";
$attr = $db->Query($sql);
*/
?>
<body>
<?php
//echo "<h1>歡迎登陸:{$attr[0][0]}</h1>"; //注釋的如果運行的話,會輸出歡迎登陸加用戶的姓名
?>
<div><a href="fabu.php">發布信息</a><br />
<a href="denglu.php" onclick=" return confirm('確定退出么?')">退出系統</a>
</div>
<table width="100%" border="1" cellpadding="0" cellspacing="0">
<tr>
<td>發送人</td>
<td>發送時間</td>
<td>接收人</td>
<td>信息內容</td>
</tr>
<?php
include("./fengzhuang.php");
$db = new fengzhuang();
$sql =" select * from xinxi";
$attr = $db->Query($sql);
foreach( $attr as $v)
{
echo " <tr>
<td>{
$v[1]}</td>
<td>{
$v[2]}</td>
<td>{
$v[3]}</td>
<td>{
$v[4]}</td>
</tr>
";
}
?>
</table>
</body>
<script type="text/javascript">
</script>
</html>

SESSION也可以用來控制登錄,如果不走登錄界面,直接打上主頁面的地址也是可以進入的,所以網頁必須要用SESSION控制一下
如果在瀏覽器上第一次打開主頁面,它會返回登錄界面,如果在瀏覽器上有已經登錄成功窗口的話,再打開主頁面,是可以進的
主頁面運行后,是這樣子的:
然后再做發布信息的頁面
<!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=utf-8" />
<title>無標題文檔</title>
</head>
<body>
<div>
<a href="liuyan.php">查看信息</a><br />
<a href="denglu.php" onclick=" return confirm('確定退出么?')">退出系統</a>
</div>
<h1>信息發送</h1>
<form action="fabuchuli.php" method="post">
<input type="hidden" name="fsr" />
<div>接收人:<input type="text" name="jsr"/></div>
<input type="hidden" name="fssj" />
<br />
<div>信息內容:<input type="text" name="xxnr" /></div>
<div><input type="submit" value="發送" /><input type="reset" value="復位" /></div>
</form>
</body>
</html>

運行后:
當然光這樣,填寫的信息是發不出去的,最重要的就是它的處理頁面
<?php
session_start();
$yh = $_SESSION["yh"];
include("./fengzhuang.php");
$db = new fengzhuang();
$sql= "select xm from zhuce where yh='{$yh}'";
$attr = $db->Query($sql);
?>
<?php
$fsr = "{$attr[0][0]}"; //發送人,也就是取得用戶的姓名
$fssj = date("Y-m-d",time()); //當前時間
$jsr = $_POST["jsr"];
$xxnr = $_POST["xxnr"];
//造連接對象
$db = new MySQLi("localhost","root","726","text11");
//寫SQL語句
$sql = "insert into xinxi values('','{$fsr}','{$fssj}','{$jsr}','{$xxnr}')";
//執行
$r=$db->query($sql);
if($r)
{
header("location:liuyan.php");
}
else
{
echo "添加失敗";

發布后立即返回留言頁面,看一下發布后的樣子:
 
頁面中多了一條數據,接收人是小紅,發送人是用戶的姓名
退出系統那里可以加個點擊事件,確定退出后打到登錄界面
所學知識可以靈活運用
 
下面再來說一下會話用法
主要講用SESSION 的用法
 購物車類型的可以用SESSION做,只是暫時把數據暫時存在SESSION里,退出再登錄就會沒有了
下面來做個例子
之前講過水果表的做法,那就引用個水果表
<!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=utf-8" />
<title>無標題文檔</title>
</head>
<body>
<table width="100%" border="1" cellpadding="0" cellspacing="0">
<tr>
<td>名稱</td>
<td>價格</td>
<td>產地</td>
<td>庫存</td>
<td>操作</td>
</tr>
<?php
include("./fengzhuang.php");
$db = new fengzhuang();
$sql = "select * from fruit";
$attr = $db->Query($sql);
foreach($attr as $v)
{
echo "<tr>
<td>{
$v[1]}</td>
<td>{
$v[2]}</td>
<td>{
$v[3]}</td>
<td>{
$v[4]}</td>
<td><a href='jiagwc.php?code={
$v[0]}'>加購物車</a></td>
</tr>
";
}
?>
</table>
</body>
</html>

水果表已經做好,只是多加了一個購物車,重要的是它的第二個頁面,運用SESSION 來存它傳遞過來的數據
<?php
session_start();
//將傳過來的水果加到購物車
$code = $_GET["code"];
//$_SESSION["gwc"];
//1.如果是第一次點擊加購物車,做一個二維數組扔到SESSION里
//2.如果不是第一次點擊加購物車并且該水果第一次點擊,做一個該水果的一維數組扔到SESSION的二維數組里面
//3.如果不是第一次點擊加購物車并且該水果不是第一次點擊,將SESSION數組里面該水果的數量加1

if(empty($_SESSION["gwc"]))
{
//1.如果是第一次點擊加購物車,做一個二維數組扔到SESSION里
$attr = array(
array($code,1)
);
$_SESSION["gwc"] = $attr;
}
else
{
//判斷該水果代號是否在SESSION數組里面出現
$attr = $_SESSION["gwc"];
if(PanDuan($code,$attr))
{
//3.如果不是第一次點擊加購物車并且該水果不是第一次點擊,將SESSION數組里面該水果的數量加1
/*foreach($attr as $v)
{
if($code == $v[0])
{
$v[1] = $v[1]+1;
}
}
*/
for($i=0;$i<count($attr);$i++)
{
if($code == $attr[$i][0])
{
$attr[$i][1]++;
}
}
$_SESSION["gwc"]=$attr;
}
else
{
//2.如果不是第一次點擊加購物車并且該水果第一次點擊,做一個該水果的一維數組扔到SESSION的二維數組里面
$arr = array($code,1);
$attr[] = $arr;
$_SESSION["gwc"]=$attr;
}
}
var_dump($_SESSION["gwc"]);
//判斷v是不是在arr里面出現
function PanDuan($v,$arr)
{
$n = 0;
foreach($arr as $a)
{
if($v == $a[0])
{
$n++;
}
}
if($n==0)
{
return false;
}
else
{
return true;
}
}

我們可以來試一下
點擊加購物車
這是第一次點,點擊了第一個,下面再返回點擊最后一個
這樣就一個傳入了兩條數據,只要不關瀏覽器,數據都是疊加的,關閉瀏覽器,重新開一次,上次的數據就會沒有了
(繼續閱讀...)
文章標籤

AutoPoster 發表在 痞客邦 留言(0) 人氣(16)

  • 個人分類:生活學習
▲top
  • 3月 09 週四 201720:30
  • 分頁查詢


文章出處
在做分頁之前得先做個類,先來看一下這個分頁類實現什么原理
<?php
/**
file: page.class.php
完美分頁類 Page
*/
class Page {
private $total; //數據表中總記錄數
private $listRows; //每頁顯示行數
private $limit; //SQL語句使用limit從句,限制獲取記錄個數
private $uri; //自動獲取url的請求地址
private $pageNum; //總頁數
private $page; //當前頁
private $config = array(
'head' => "條記錄",
'prev' => "上一頁",
'next' => "下一頁",
'first'=> "首頁",
'last' => "末頁"
);
//在分頁信息中顯示內容,可以自己通過set()方法設置
private $listNum = 10; //默認分頁列表顯示的個數
/**
構造方法,可以設置分頁類的屬性
@param int $total 計算分頁的總記錄數
@param int $listRows 可選的,設置每頁需要顯示的記錄數,默認為25條
@param mixed $query 可選的,為向目標頁面傳遞參數,可以是數組,也可以是查詢字符串格式
@param bool $ord 可選的,默認值為true, 頁面從第一頁開始顯示,false則為最后一頁
*/
public function __construct($total, $listRows=25, $query="", $ord=true)//參數,第一個數據總條數,第二每頁顯示的條數,第三個是查詢條件,第四個決定是第一頁還是最后一頁開始
{
$this->total = $total;
$this->listRows = $listRows;
$this->uri = $this->getUri($query);
$this->pageNum = ceil($this->total / $this->listRows);//總頁數等于數據總條數除于每頁顯示幾條,如果除出來是小數的話,用ceil向上取整
/*以下判斷用來設置當前面*/
if(!empty($_GET["page"])) {
$page = $_GET["page"];
}
else{
if($ord)
$page = 1;
else
$page = $this->pageNum; //把當前頁取出來
}
if($total > 0) {
if(preg_match('/\D/', $page) ){ //正則里的方法
$this->page = 1;
}
else{
$this->page = $page;
}
}
else{
$this->page = 0;
}
$this->limit = "LIMIT ".$this->setLimit();
}
/**
用于設置顯示分頁的信息,可以進行連貫操作
@param string $param 是成員屬性數組config的下標
@param string $value 用于設置config下標對應的元素值
@return object 返回本對象自己$this, 用于連慣操作
*/
function set($param, $value){
if(array_key_exists($param, $this->config)){
$this->config[$param] = $value;
}
return $this;
}
/* 不是直接去調用,通過該方法,可以使用在對象外部直接獲取私有成員屬性limit和page的值 */
function __get($args){
if($args == "limit" || $args == "page")
return $this->$args;
else
return null;
}
/**
按指定的格式輸出分頁
@param int 0-7的數字分別作為參數,用于自定義輸出分頁結構和調整結構的順序,默認輸出全部結構
@return string 分頁信息內容
*/
function fpage(){
$arr = func_get_args(); //用戶參數
$html[0] = "<span class='p1'>&nbsp;共<b> {$this->total} </b>{$this->config["head"]}&nbsp;</span>";
$html[1] = "&nbsp;本頁 <b>".$this->disnum()."</b> 條&nbsp;";
$html[2] = "&nbsp;本頁從 <b>{$this->start()}-{$this->end()}</b> 條&nbsp;";
$html[3] = "&nbsp;<b>{$this->page}/{$this->pageNum}</b>頁&nbsp;";
$html[4] = $this->firstprev();
$html[5] = $this->pageList();
$html[6] = $this->nextlast();
$html[7] = $this->goPage();
$fpage = '<div style="font:12px \'\5B8B\4F53\',san-serif;">';
if(count($arr) < 1)
$arr = array(0, 1,2,3,4,5,6,7);
for($i = 0; $i < count($arr); $i++)
$fpage .= $html[$arr[$i]];
$fpage .= '</div>';
return $fpage;
}
/* 在對象內部使用的私有方法,*/
private function setLimit(){
if($this->page > 0)
return ($this->page-1)*$this->listRows.", {$this->listRows}";
else
return 0;
}
/* 在對象內部使用的私有方法,用于自動獲取訪問的當前URL */
private function getUri($query){
$request_uri = $_SERVER["REQUEST_URI"];
$url = strstr($request_uri,'?') ? $request_uri : $request_uri.'?';
if(is_array($query))
$url .= http_build_query($query);
else if($query != "")
$url .= "&".trim($query, "?&");
$arr = parse_url($url);
if(isset($arr["query"])){
parse_str($arr["query"], $arrs);
unset($arrs["page"]);
$url = $arr["path"].'?'.http_build_query($arrs);
}
if(strstr($url, '?')) {
if(substr($url, -1)!='?')
$url = $url.'&';
}
else{
$url = $url.'?';
}
return $url;
}
/* 在對象內部使用的私有方法,用于獲取當前頁開始的記錄數 */
private function start(){
if($this->total == 0)
return 0;
else
return ($this->page-1) * $this->listRows+1;
}
/* 在對象內部使用的私有方法,用于獲取當前頁結束的記錄數 */
private function end(){
return min($this->page * $this->listRows, $this->total);
}
/* 在對象內部使用的私有方法,用于獲取上一頁和首頁的操作信息 */
private function firstprev(){
if($this->page > 1) {
$str = "&nbsp;<a href='{$this->uri}page=1'>{$this->config["first"]}</a>&nbsp;";
$str .= "<a href='{$this->uri}page=".($this->page-1)."'>{$this->config["prev"]}</a>&nbsp;";
return $str;
}
}
/* 在對象內部使用的私有方法,用于獲取頁數列表信息 */
private function pageList(){
$linkPage = "&nbsp;<b>";
$inum = floor($this->listNum/2);
/*當前頁前面的列表 */
for($i = $inum; $i >= 1; $i--){
$page = $this->page-$i;
if($page >= 1)
$linkPage .= "<a href='{$this->uri}page={$page}'>{$page}</a>&nbsp;";
}
/*當前頁的信息 */
if($this->pageNum > 1)
$linkPage .= "<span style='padding:1px 2px;background:#BBB;color:white'>{$this->page}</span>&nbsp;";
/*當前頁后面的列表 */
for($i=1; $i <= $inum; $i++){
$page = $this->page+$i;
if($page <= $this->pageNum)
$linkPage .= "<a href='{$this->uri}page={$page}'>{$page}</a>&nbsp;";
else
break;
}
$linkPage .= '</b>';
return $linkPage;
}
/* 在對象內部使用的私有方法,獲取下一頁和尾頁的操作信息 */
private function nextlast(){
if($this->page != $this->pageNum) {
$str = "&nbsp;<a href='{$this->uri}page=".($this->page+1)."'>{$this->config["next"]}</a>&nbsp;";
$str .= "&nbsp;<a href='{$this->uri}page=".($this->pageNum)."'>{$this->config["last"]}</a>&nbsp;";
return $str;
}
}
/* 在對象內部使用的私有方法,用于顯示和處理表單跳轉頁面 */
private function goPage(){
if($this->pageNum > 1) {
return '&nbsp;<input style="width:20px;height:17px !important;height:18px;border:1px solid #CCCCCC;" type="text" onkeydown="javascript:if(event.keyCode==13){var page=(this.value>'.$this->pageNum.')?'.$this->pageNum.':this.value;location=\''.$this->uri.'page=\'+page+\'\'}" value="'.$this->page.'"><input style="cursor:pointer;width:25px;height:18px;border:1px solid #CCCCCC;" type="button" value="GO" onclick="javascript:var page=(this.previousSibling.value>'.$this->pageNum.')?'.$this->pageNum.':this.previousSibling.value;location=\''.$this->uri.'page=\'+page+\'\'">&nbsp;';
}
}
/* 在對象內部使用的私有方法,用于獲取本頁顯示的記錄條數 */
private function disnum(){
if($this->total > 0){
return $this->end()-$this->start()+1;
}
else{
return 0;
}
}
}

然后用這個分頁類去做一個分頁查詢
<!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=utf-8" />
<title>無標題文檔</title>
</head>
<body>
<!--共10頁 5/10 首頁 上一頁 1 2 3 4 5 6 7 8 下一頁 尾頁 跳轉 【】 頁-->
<table width="100%" border="1" cellpadding="0" cellspacing="0">
<tr>
<td>地區代號</td>
<td>地區名稱</td>
<td>父級代號</td>
</tr>
<?php
include("./fengzhuang.php");
include("./page.php");
$db = new fengzhuang();
//求總條數
$sz = "select count(*) from chinastates";
$az = $db->Query($sz);
$zts = $az[0][0];
//造分頁類對象
$page = new Page($zts,20); //括號里面是總條數,和每頁顯示的條數
$sql = "select * from chinastates ".$page->limit; //執行了一個分頁查詢
echo $sql;
$attr = $db->Query($sql);
foreach($attr as $v)
{
echo "<tr>
<td>{
$v[0]}</td>
<td>{
$v[1]}</td>
<td>{
$v[2]}</td>
</tr>
";
}
?>
</table>
<div><?php
//調用分頁信息并輸出
echo $page->fpage(); //可以從類文件里看自己需要那幾個部分,可以寫在括號里,什么都不寫的話就是全部有
?></div>
</body>
</html>

詳細介紹都在注釋中,運行后的結果如圖所示:
當點擊末頁時
 
 以下的幾項功能都可以用
上面瀏覽器的地址隨著條數的變化而變化
(繼續閱讀...)
文章標籤

AutoPoster 發表在 痞客邦 留言(0) 人氣(2)

  • 個人分類:生活學習
▲top
  • 3月 09 週四 201720:30
  • 批量刪除


文章出處
多條數據一同刪除,叫做批量刪除
 首先我們需要做一張nation表,和之前得一樣,連接數據庫,表中是兩列,代號和名稱,行隨便先加點,在最前面再給它加一列,加復選框,最上面一行寫個全選的復選框,再在表下面放一個刪除的按鈕
<body>
<form action="piliangshanchu.php" method="post">
<table width="100%" border="1" cellpadding="0" cellspacing="0">
<tr>
<td><input type="checkbox" id="qx" onclick="xuanzhong()"/>全選</td>
<td>代號</td>
<td>名稱</td>
</tr>
<?php
include("./fengzhuang1.php");
$db = new fengzhuang();
$sql = "select * from nation";
$attr = $db->Query($sql);
foreach($attr as $v)
{
echo "<tr>
<td><input type = 'checkbox' name='ck[]' class='ck' value='{
$v[0]}'/></td>
<td>{
$v[0]}</td>
<td>{
$v[1]}</td>
</tr>
";
}
?>
</table>
<input type="submit" value="刪除" onclick="return tishi()" />
</form>
</body>

和以前插入數據庫的表是一樣的,先把整體做出來,這里還要做js,一個是控制復選框的,另一個是點擊刪除按鈕時,彈出的對話框,其實在刪除后面直接添加一個onclick="return confirm('確定刪除么')"    就可以,但是為了讓它顯示的更具體一點,我們采用js的方法,下面來看一下js部分的代碼
<script type="text/javascript">
function xuanzhong()
{
//取全選按鈕的選中狀態
var zt = document.getElementById("qx").checked;
//讓下面所有的checkbox選中狀態改變
var ck = document.getElementsByClassName("ck");
for(var i= 0;i<ck.length;i++)
{
if(zt)
{
ck[i].setAttribute(
"checked","checked");
}
else
{
ck[i].removeAttribute(
"checked");
}
}
}
function tishi()
{
//找所有選中項
var ck = document.getElementsByClassName("ck");
var str = "";
for(var i = 0; i<ck.length;i++)
{
if(ck[i].checked)
{
str
+= ck[i].value+",";
}
}
return confirm("確定要刪除以下數據么:"+str+"");
}
</script>

既然要刪除按鍵,就得有個from表單,把它提交到另一個頁面
新建一個頁面,里面只寫php內容
<?php
$ck = $_POST["ck"];
include("./fengzhuang.php");
$db = new fengzhuang();
/*foreach($ck as $v)
{
$sql = "delete from nation where code='{$v}'";
$db->Query($sql,0);
}
*/
//第二種方式
$str = implode("','",$ck);
$str = "('{$str}')";
$sql = "delete from nation where code in {$str}";
$db->Query($sql,0);
header("location:piliang.php");

 
兩種方法都可以用,
第一種是用一個循環,每次找到個主健然后刪掉,缺點就是要執行好多遍
第二種是用拼接字符串的形式
最后都是跳轉到第一個頁面
現在我們來看一下操作的效果
一個非常簡單的nation表,表中的內容可以隨便寫,當我們點擊全選時:
復選框的按鈕則全部選中,當再次點擊全選時,
選中則全部取消
我們再來看一下點擊刪除時,會彈出什么樣的對話窗
全部選中時,對話框會顯示全部選中者的代號
當選中第一個和第四個的時候,彈出的對話框也對應的顯示他們的代號,也就是主鍵值
 
(繼續閱讀...)
文章標籤

AutoPoster 發表在 痞客邦 留言(0) 人氣(2)

  • 個人分類:生活學習
▲top
  • 3月 09 週四 201720:29
  • 比Mysqli操作數據庫更簡便的方式 。PDO


文章出處
下面來說一下PDO
先畫一張圖來了解一下
mysqli是針對mysql這個數據庫擴展的一個類
PDO是為了能訪問更多數據庫
如果出現程序需要訪問其他數據庫的話就可以用PDO來做
PDO
數據訪問抽象層
1、操作其他數據庫
2、事務功能
3、防止SQL注入攻擊
用PDO來舉個例子
<!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=utf-8" />
<title>無標題文檔</title>
</head>
<body>
<?php
//1、操作其他數據庫
//2、事務功能
//3、防止SQL注入攻擊
//造PDO對象

$dsn = "mysql:dbname=shuang;host=localhost"; //數據源
$pdo = new PDO($dsn,"root","726");//需要三個參數
//寫SQL語句

$sql = "select * from nation";
//執行
$attr = $pdo->query($sql);
$arr = $attr->fetch(PDO::FETCH_ASSOC); //這里的參數不需要單引號雙引號
var_dump($arr);
?>
</body>
</html>

調用一下fetch里面的參數為  PDO::FETCH_ASSOC
輸出一下attr
輸出的是一個關聯數組
把里面參數ASSOC換為NUM,輸出:
 
 輸出為索引的
如果參數ASSOC改為  BOTH,輸出:
則關聯和索引都有
改為fetchALL(PDO::FETCH_BOTH)也可以,它是把所有數據都可以查到
用PDO來做個添加語句試試看
<!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=utf-8" />
<title>無標題文檔</title>
</head>
<body>
<?php
//1、操作其他數據庫
//2、事務功能
//3、防止SQL注入攻擊
//造PDO對象

$dsn = "mysql:dbname=shuang;host=localhost"; //數據源
$pdo = new PDO($dsn,"root","726");//需要三個參數
//寫SQL語句
//$sql = "select * from nation";

$sql = "insert into nation values('n076','數據')"; //添加語句
//執行

$a = $pdo->query($sql);
var_dump($a);
//$arr = $attr->fetchALL(PDO::FETCH_BOTH); //這里的參數不需要單引號雙引號
//var_dump($arr);

?>
</body>
</html>

運行試試看:
再看一下,數據庫內,有沒有添加上數據
添加成功
PDO中除了用query方法,還可以用一種
exec  方法
運行后看看效果
顯示了一個1,證明影響了1行數據
再看看數據庫
077已添加進去
如果失敗了,運行后會顯示0
query方法一般是用來執行查詢
exec是用來執行其他語句
它的第一個功能就講完了
接下來說一下第2種事務功能
 
 運行一下,078讓它添加,077重復,肯定添加不進去
查看一下數據庫:
078在里面,077主鍵相同不能被添加
在下面加個事務功能
開啟事務和提交是對應的,有開啟就一定有提交,回滾,是讓它回滾到原來的位置
如果添加的話,按理說079可以添加上,077重復,不可以添加,但是加了事務功能后,要么一起成功,要么一起失敗,看一下運行后的數據庫
079和077的內容都沒有被添加上
把重復的077改成080,運行后,看一下數據庫內的數據
添加成功!
再來看一下它最后一個功能
還是用nation表來做
<!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=utf-8" />
<title>無標題文檔</title>
</head>
<body>
<?php
//預處理語句防止SQL注入
$dsn = "mysql:dbname=shuang;host=localhost";
$pdo = new PDO($dsn,"root","726");
$code = "n001";
//SQL語句里面需要加占位符?
$sql = "select * from nation where code=?";
//準備執行。返回PDOStatement對象
$st = $pdo->prepare($sql);
//調用綁定參數的方法來綁定參數
$st->bindParam(1,$code);
$st->execute();
$attr = $st->fetchAll();
var_dump($attr);
?>
</body>
</html>

運行后,查到了結果
使用的是分兩次來發送到服務器,就不會出現注入攻擊了
再做一個添加語句
運行后,再看一下數據庫,是否添加成功了
測試1 在數據庫內,證明運行成功了
但是考慮到,數據很多的情況下,用上述方法會很麻煩,所以還有一種簡單方法
用數組的方式來做,只是索引數組
運行后,來看一下有沒有把數據添加到數據庫
測試2 在數據庫內,運行成功
除了用問號占位符,還可以用字符串占位符
來看一下用字符串占位符怎么做
<!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=utf-8" />
<title>無標題文檔</title>
</head>
<body>
<?php
$dsn = "mysql:dbname=shuang;host=localhost";
$pdo = new PDO($dsn,"root","726");
//占位符是字符串
$sql = "insert into nation values(:code,:name) ";
$st = $pdo->prepare($sql);
$st->bindParam(":code",$code,PDO::PARAM_STR);
$st->bindParam(":name",$name,PDO::PARAM_STR);
$code = "n009";
$name = "測試3";
$st->execute();
?>
</body>
</html>

看看數據庫內,有沒有加上這條數據
測試3已成功添加
證明用字符串占位符也是可以的
如果調用bindParam方法,就要寫參數,這種方法有點麻煩,它還有簡便的方法,還可以使用數組的方式
不過這里使用的數組和上面使用的數組就不一樣了,上面使用的是索引數組,這里使用的是關聯數組
來看一下代碼部分怎么寫
比剛才的方式簡便了許多,array里面的要和sql語句里面的值相對應,來看一下數據庫內有沒有添加上
測試4,添加成功
看了這么多測試,可能會有人問了,Mysqli和PDO到底使用哪種方式簡單
下面來舉個例子吧
做個添加的例子
重要的是它的處理頁面
只需要五行代碼就可以,來實驗一下
看一下數據庫內
測試5添加成功!
我們想一下,之前使用的Mysqli的方式,還需要取數據,好幾行數據的話,還需要取好幾個數據
這種方式就是一次性的都過來,這種方式還可以防止注入攻擊
說一下防止注入攻擊的原理
先把SQL語句外面這些東西發到服務器等待執行,分第二次發送,它的值,來判斷code是否等于它。
之前那種方式是把好幾個變量拼在一起去執行,那樣的話可以讓人篡改我們的SQL語句
PDO的這種方式并不能篡改,無論扔什么值都會判斷是否相等
(繼續閱讀...)
文章標籤

AutoPoster 發表在 痞客邦 留言(0) 人氣(29)

  • 個人分類:生活學習
▲top
  • 3月 09 週四 201720:29
  • jquery和Js的區別和基礎操作


文章出處
jquery的語法和js的語法一樣,算是把js升級了一下,這兩種語法可以一起使用,只不過是用jqery更加方便
一個頁面想要使用jquery的話,先要引入一下jquery包,jquery包從網上下一個就可以,一般用帶有min的,是壓縮版的,如果還要引用其他js文件的話,一定要jquery包在上面,其他的引用放在他下面
先來看看如果使用Jquery的話,怎么來引用Jquery包
這樣來引用,然后就可以用Jquery方法了
和js的語法一樣,都是寫在<script type = "text/javascript"></script>這里面的
在Jquery中,$ 代表選擇器
很多點擊事件,特效都是在頁面加載完成后再去執行
Jquery中在使用時,要在js代碼最外層加上這樣一句話   $(document).ready(function(e){})  選中當前頁面有個ready事件,頁面加載完成事件,頁面加載完成后就進去走里面的事件,所以一般代碼都寫在花括號里面
來看一下用Jquery和Js輸出統一內容,運行的結果會怎么樣
 <!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=utf-8" />
<title>無標題文檔</title>
<script src="../jquery-1.11.2.min.js"></script>
</head>

Jquery
$代表選擇器
JS
選取樣式
操作內容
操作屬性
操作樣式
<div id="aa">11</div>
<body>
<script type="text/javascript">
//頁面加載完成
$(document).ready(function(e){
//頁面加載完成之后執行
//JS
//找元素
var a = document.getElementById("aa");
alert(a);
//Juery
//找元素
var b = $("#aa");
alert(b);
});
</script>
</body>
</html>

運行后的結果
點擊確定
 
 第一個彈出的是用Js寫的
第二個彈出的是用Jquery寫的
有的人就會問,為什么運行的結果會不一樣呢?
因為Js中找元素,找的是DOM對象
Jquery中找對象,找的是Jquery對象
Jquery是JS的升級版,所以功能比較強大,Jquery對象中也包括DOM對象
來看一下怎么用Jquery取到DOM對象
取b的索引0
看一下運行的結果
點擊確定
兩個是一樣的結果
所以在使用中要知道怎么把Jquery對象轉換成DOM對象
一般是不需要轉換的,特殊情況才需要轉
上面那種是根據div來找的,下面再來根據class來做
代碼截了關鍵的一部分
這里的a 包括div中的,還有span中的
看一下它運行的結果
collection一般是集合的意思,但是在js中沒有集合,它代表的是數組
如果要取它的第一項,可以找它的索引0
看一下運行的結果
找的是div
再把它改成索引1
看看運行的結果
索引1  找到的是span
所以如果想取到某一項時,可以使用索引來找到它
再來看一下Juery部分
看一下運行結果
輸出的還是Jquery對象
要想取到div和span,看看來怎么做
索引0,看取到的結果
是div的
再看索引1
看運行結果
取到的是span
還有一種方式
看看運行的結果
取到的是Jquery對象
再看用標簽名來找,先來看Juery中
取它的索引0,看看運行的結果
再看Js中,根據name找
先做個表單
然后取索引0,運行一下
取到的是input
Juery里面沒有根據name找的方式
但是有屬性的方式
根據屬性來找
看一下它運行的結果
找的了input
如果給他自定義一個屬性,aa="bb"
看運行的結果
也一樣找到了
還可以用id的屬性來找
找的的結果div
 
一般Juery常用的方式有這幾種
接下來來看一下js,Juery 在操作內容   操作屬性和操作樣式的區別
Jquery
$代表選擇器
JS
選取元素
操作內容
操作屬性
操作樣式
<div id="aa" style="width:100px; height:100px;">11</div>
<div class="aa">22</div>
<span class="aa">33</span>
<input type="text" name="uid" aa="bb" id="cc" />
<input type="checkbox" value="1" id="dd" />
</body>
<script type="text/javascript">
//頁面加載完成
$(document).ready(function(e) {
//頁面加載完成之后執行
//JS
//找元素,DOM對象
//var a = document.getElementById("aa");
//alert(a);
//var a = document.getElementsByClassName("aa");
//alert(a[1]);
//var a = document.getElementsByTagName("div");
//var a = document.getElementsByName("uid");
//alert(a[0]);
//操作內容
//a.innerHTML //操作元素里面的html代碼
//a.innerTEXT //操作元素里面的文本
//a.value //操作表單元素的值
//操作屬性
//a.setAttribute("",""); //設置
//a.removeAttribute(""); //移除
//a.getAttribute(""); //獲取
//操作樣式
//a.style.backgroudColor = "red";
//Jquery
//找元素,Jquery對象
//var b = $("#aa"); //根據ID找
//alert(b[0]);
//var b = $(".aa"); //根據class找
//alert(b[1]); //找到的是DOM對象
//alert(b.eq(1)); //找到的是Jquery對象
//var b = $("div"); //根據標簽名找
//alert(b[0]);
//var b = $("[id='aa']"); //根據屬性找
//alert(b[0]);
//操作內容
//非表單元素
//b.html(); //操作元素里面的HTML代碼,可以往里面放標簽,設置樣式
//b.text(); //操作元素里面的文本,可以往里面放參數
//表單元素
//b.val("hello");
//操作屬性
//設置屬性
//b.attr("bs","test");
//獲取屬性
//alert(b.attr("aa"));
//移除屬性
//b.removeAttr("aa");
//b.prop("checked",false);
//操作樣式,可以獲取內嵌的樣式
//b.css("background-color","red");
//alert(b.css("width"));
//alert(b.css("background-color"));

});
</script>

操作的內容可以自己試驗一下
相比之下,Jquery方式更為簡便,同樣的結果,js需要代碼很長,Jquery需要的代碼很短
 
(繼續閱讀...)
文章標籤

AutoPoster 發表在 痞客邦 留言(0) 人氣(19)

  • 個人分類:生活學習
▲top
  • 3月 09 週四 201720:29
  • 三步完成博客打賞功能


文章出處
打賞功能簡單概括一下就是別人進入你的博客園,能看到打賞,打賞可以通過支付寶和微信的方式來向你支付打賞金額,之前看到博客上許多人發這個功能,我就總結了一下,盡量用最簡單的方式來讓別人看懂,然后加以運用
使用的是js方法首先在我的博客里面點擊管理,如圖:
點進去之后,再點擊設置
在設置頁面,點擊申請Js代碼,因為我的申請過了,所以是這個狀態
點擊申請后,填寫申請理由,大約等一二十分鐘,申請就通過了
接下來步入主題
第一步
用手機保存自己支付寶和微信的收款圖片,然后發到自己電腦的QQ上,截個合適的大小,然后再利用圖畫,更改圖片的格式,如圖:
保存后,再傳到自己的博客園,如圖:
 
 這樣第一步就完成了
接下來第二步
把下面代碼復制到你自己的博客中去,如圖:
<script>
window.tctipConfig
= {
staticPrefix:
"http://static.tctip.com",
cssPrefix:
"http://static.tctip.com",
buttonImageId:
1,
buttonTip:
"dashang",
list:{
alipay: {qrimg:
"http://files.cnblogs.com/files/qishuang/QQ圖片20170106091919.bmp"},
weixin:{qrimg:
"http://files.cnblogs.com/files/qishuang/QQ圖片20170106105448.bmp"},
}
};
</script>
<script src="http://static.tctip.com/js/tctip.min.js"></script>

粘貼到這里
當然前提是你的Js申通得通過了才能用
第二步就完成了
接下來是第三步
更改里面的內容
其中這兩條內容是需要改的,其他的不用
qishuang 是Blog地址名
后面那個是圖片的名字,都需要填寫你自己的內容
地址名如果有不知道的,往上滾動一下就可以看到,如圖:
和你要粘貼代碼在同一個頁面
更改完成后,保存就可以了
三步完成一個功能,是不是很簡單
這里要注意一下,地址名和圖片名要看清楚,兩句都需要寫自己的,還有就是圖片的格式一定要對
 
(繼續閱讀...)
文章標籤

AutoPoster 發表在 痞客邦 留言(0) 人氣(24)

  • 個人分類:生活學習
▲top
  • 3月 09 週四 201720:29
  • Jquery 搭配 css 使用,簡單有效


文章出處
前幾篇博客中講了Jquery的基礎和點擊實際,下面來說一下和css搭配著來怎么做
還是和往常一樣,舉個例子
好幾個方塊,然后設置顏色
<!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=utf-8" />
<title>無標題文檔</title>
<script src="jquery-1.11.2.min.js"></script>
<style type="text/css">
.aa
{ width:200px; height:200px; float:left;margin:5px; background-color:#039}
</style>
</head>
<body>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
<div class="aa">
</div>
</body>
</html>

順便復習一下css的知識
給.aa加的樣式   寬200像素  高200像素   向左流  距離5像素   顏色隨便設置,這里設置的是藍色
來看一下運行運行的效果
大概就這樣,div設置幾個都ok
讓它執行每點擊一塊就變顏色
如果用Js來做的話,要寫好多代碼,所以選擇Jquery方法來做
來看一下Jquery 代碼部分
先找到.aa 點擊加事件,里面的$(this)  是找到點擊了誰,然后給他加css 背景色
來看一下運行的效果
點擊哪塊,哪塊就會變為紅色
但是得再讓它變回來,所以還得加Jquery代碼
只需要在它上面再加一句代碼就可以了,兩句代碼組合起來的意思就是,當時點擊誰誰背景色才會變為紅的,其他的都是原先的背景色,這里要注意原來的背景色要和最上面設置的背景色一致
來看一下效果
點擊哪塊,哪塊變為紅的,當點其他塊的時候,之前的那塊又會變為原先的背景色
除了有點擊事件,還有移上事件,也就是鼠標移上去就可以觸發的事件
代碼可以來看一下
暫時把點擊代碼部分注釋了,。mousemove  移上的意思
只是換了一個代碼而已,其他的代碼都一樣
有意向的可以做一下試試,移上事件就不看效果了,圖片看不出來,背景色會跟著鼠標移動的位置改變
如果讓兩者同時實現的話,也可以
可能有人會想到這樣操作
這樣寫操作起來會有BUG,這樣操作的效果會是移上是黃色,點擊一下只要鼠標不動就是紅色,但是鼠標稍微移動,會立馬變成黃色
來看一下代碼正確的寫法
先給點擊事件加個屬性標識,然后再在移上事件后面加句代碼,屬性篩選,根據該屬性找到元素,設置背景顏色
看一下運行的效果
點擊某一塊會變成紅色,鼠標移動除了被點擊的那塊,其他的會照樣變成黃色
 
(繼續閱讀...)
文章標籤

AutoPoster 發表在 痞客邦 留言(0) 人氣(3)

  • 個人分類:生活學習
▲top
  • 3月 09 週四 201720:27
  • Jquery操作下拉列表和復選框,自定義下拉


文章出處
后半部分還有自定義下拉列表和開燈關燈的效果,可以進來來看一下 哦
如果網頁有下拉列表和復選框,看一下Jquery怎么來操作他們,主要怎么來選取他們的數據,怎么設置某一項選中
先來看個下拉列表
<body>
<select id="sel">
<option value="張店">張店</option>
<option value="淄川">淄川</option>
<option value="博山">博山</option>
<option value="桓臺">桓臺</option>
</select>
<input type="button" value="取值" id="qu" />
</body>

上面是一個非常簡單的下拉列表,加了一個按鈕,可以選取他們的值,取值的話就得給下拉列表加value
運行后就是這樣的:
然后需要用到Jquery,所以要先引入Jquery包
然后就可以寫js代碼了
對括號里面的e,有解釋,來看一下e.都包括哪些數據
如果這個事件不是點擊事件,是關于按鍵的事件,如按鍵按下按鍵抬起,則這時候e就包含了按鍵的數據,能夠取到能按了什么鍵
來看一下運行的結果
下拉列表選中哪個,然后點擊取值,就會取到選中的那個值
再加一個賦值的按鈕
寫賦值的js代碼部分
賦值和取值都需要val方法就可以完成
來看一下運行結果
比如說,本來是這個狀態:
然后點擊一下賦值
就會變成代碼內val值對應的地址
 下面再來看個復選框列表
 
看一下js代碼部分
運行后的結果:
如果三個都選中,那么會彈出三個窗口,先是張店,點擊確定然后淄川,再點確定隨后周村
 有取值了,可以再給它設個賦值試試
js代碼部分
看一下能不能運行成功
點擊賦值后,就選中了值為周村的復選框,運行成功
這樣有點麻煩,還有簡單的做法
只需要三句,看一下能不能運行成功
點擊賦值,可以選中,運行成功
下面做一個,自定義的下拉列表,外加一個開燈關燈效果
<!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=utf-8" />
<title>無標題文檔</title>
<script src="../xinphp/jquery-1.11.2.min.js"></script>
<style type="text/css">
#zz
{width:100%; height:100%; position:absolute; left:0px; top:0px; background-color:black; z-index:5;filter:alpha(opacity=50);
-moz-opacity
:0.5;
-khtml-opacity
: 0.5;
opacity
: 0.5;}
</style>
</head>
<body>
<select id="sel">
</select>
<input type="text" id="shuru" />
<input type="button" value="添加" id="btn" />
<input type="button" value="移除" id="yichu" />
<div id="shang" style="position:absolute; z-index:10; left:100px; top:100px;">
<input type="button" value="關燈" id="guan" />
<input type="button" value="開燈" id="kai" />
</div>
</body>
<script type="text/javascript">
$(
"#btn").click(function(){
var v = $("#shuru").val();
//var str = "<option value='"+v+"'>"+v+"</option>";
//造元素
var op = document.createElement("option");
op.setAttribute(
"value",v);
op.innerHTML
= v;
$(
"#sel").append(op); //追加

})
$(
"#yichu").click(function(){
var v = $("#shuru").val();
$(
"[value='"+v+"']").remove(); //移除
})
$(
"#guan").click(function(){
var str = "<div id='zz'></div>";
$(
"body").append(str);
$(
this).css("display","none");
$(
"#kai").css("display","block");
})
$(
"#kai").click(function(){
$(
"#zz").remove();
$(
"#guan").css("display","block");
$(
this).css("display","none");
})
</script>
</html>

來看一下運行效果
開始是這樣的
 
 添加數據
點擊添加
數據已經在里面了
再點擊移除
成功刪除bb
 
 再來看一下關燈開燈的效果
 
點擊關燈后
再點擊開燈
運行成功!
有興趣的也可以做做試試
(繼續閱讀...)
文章標籤

AutoPoster 發表在 痞客邦 留言(0) 人氣(7)

  • 個人分類:生活學習
▲top
  • 3月 09 週四 201720:25
  • 文件上傳------圖片


文章出處
文件上傳,拿上傳圖片做個例子
首先要寫個form表單,之前是提交數據的,現在要上傳文件提交圖片,所以要在后面多加一個屬性
然后再選擇文件,最后上傳
來看一下第一個頁面的代碼部分
運行后看一下效果
在這里不同的瀏覽器運行后,會出現不一樣的樣式,但是功能都是一樣的用,點擊瀏覽后,會彈出選擇文件的窗口
隨便選擇一個文件
 
 文件名就會顯示在頁面上,通過點擊上傳經過處理頁面然后提交
接下來再做第二個頁面  shangchuan.php
 第二個頁面提交的因為不是數據了,所以這里就不能用post了
可以使用files數組來取了
來看一下代碼,先輸出一下,看它輸出的都是些什么
點擊上傳
出來的是數組
file數組里面能夠取到的內容  tem_name  后面是文件的路徑,在服務器上暫時存了個臨時文件
如果常理來說只需要再做一步,把文件保存了就可以,但是做程序不能那么簡單的做,得考慮各種因素,各個方面
1、控制上傳文件的類型
2、控制上傳文件的大小
3、防止文件名重復
    修改保存的文件名       (1)用戶名+時間戳+隨機數+文件名    (2)流水號
    使用文件夾存文件防止文件名重復       最常用的是第一種
4、保存文件
 
來看一下shangchuan.php 頁面代碼部分
<?php
//var_dump($_FILES["file"]); //索引寫它的name值
//判斷文件上傳是否出錯

if($_FILES["file"]["error"])
{
echo $_FILES["file"]["error"];
}
else
{
//控制上傳文件類型
if(($_FILES["file"]["type"]=="image/jpeg" || $_FILES["file"]["type"]=="image/png") && $_FILES["file"]["size"]<1024000)
{
//找到文件存放的位置
$filename = "./file/".date("YmdHis").$_FILES["file"]["name"]; //加 . 拼接
//轉換編碼格式

$filename = iconv("UTF-8","gb2312",$filename);
//判斷文件是否存在
if(file_exists($filename))
{
echo "該文件已存在!";
}
else
{
//保存文件
move_uploaded_file($_FILES["file"]["tmp_name"],$filename); //移動上傳文件
}
}
else
{
echo "文件類型不正確";
}
}

在運行前,先建個文件夾,在同一目錄下
用來儲存上傳的圖片
用第一個頁面運行一下,看看能不能運行成功
點擊上傳
然后再去看一下那個文件夾
 
 上傳成功
注明: 如果上傳的這些類型是偽造的,怎么確保保存的是上傳圖片,而不是隨便給的一個路徑
通過   就可以確保,保存的一定是上傳文件
 
 
這句話是從UTF—8,轉換為國標,用iconv方法就可以,如果不轉換的話,有些文件名會有出現亂碼的情況
(繼續閱讀...)
文章標籤

AutoPoster 發表在 痞客邦 留言(0) 人氣(20)

  • 個人分類:生活學習
▲top
  • 3月 09 週四 201720:24
  • 文件上傳-------頭像上傳預覽


文章出處
這次來講怎么來用代碼完成頭像更換
在上篇博客中也說了圖片上傳,但選擇文件的之后,在網頁上并沒有顯示這張圖片,如果是要做頭像的話,最好有頭像預覽
就像平時我們換QQ頭像那樣,一點圖片就會出來文件預覽,然后再選擇一張圖片,點擊,頁面就會換成你剛剛點擊的那張圖片
來看一下做法,先說第一個頁面
<!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=utf-8" />
<title>無標題文檔</title>
<style type="text/css">
#yl
{ width:200px; height:300px; background-image:url(file/20170112113928n2.png); background-size:200px 300px;} 這里是選背景圖的路徑,到時候引用的話別忘了改
#file
{ width:200px; height:300px; float:left; opacity:0;} <!--使按鈕的大小和上面的背景圖一樣大,把按鈕設置為透明-->
</style>
</head>
<body>
<form id="sc" action="yulan2.php" method="post" enctype="multipart/form-data" target="shangchuan">
<input type="hidden" name="tp" value="" id="tp" />
<div id="yl">
<input type="file" name="file" id="file" onchange="document.getElementById('sc').submit()" /> <!-- form表單,在iframe里面提交,target屬性 瀏覽器的打開方式,處理頁面是到iframe運行,后面那句話是選中后,用submit方法提交-->
</div>
</form>
<iframe style="display:none" name="shangchuan" id="shangchuan"> <!--隱藏掉-->
</iframe>
</body>
<script type="text/javascript">
//回調函數,調用該方法傳一個文件路徑,該變背景圖
function showimg(url)
{
var div = document.getElementById("yl");
div.style.backgroundImage
= "url("+url+")";
document.getElementById(
"tp").value = url;
}
</script>
</html>

 
運行后
點擊圖片
就會彈出來文件上傳的窗口
 再來看第二個頁面
<?php
if($_FILES["file"]["error"])
{
echo $_FILES["file"]["error"];
}
else
{
if(($_FILES["file"]["type"]=="image/jpeg" || $_FILES["file"]["type"]=="image/png")&& $_FILES["file"]["size"]<1024000)
{
$fname = "./img/".date("YmdHis").$_FILES["file"]["name"]; //在同一路徑下再建一個img 的文件,到時候上傳的文件就保存在這個文件夾下
$filename = iconv("UTF-8","gb2312",$fname);
if(file_exists($filename))
{
echo "<script>alert('該文件已存在!');</script>";
}
else
{
move_uploaded_file($_FILES["file"]["tmp_name"],$filename);
unlink($_POST["tp"]); //刪除原來的文件
echo "<script>parent.showimg('{$fname}');</script>";
}
}
}

可以來看一下運行的效果
點擊任意一張圖片
頭像成功更換
再來看一下img ,文件夾
有這張圖片,再把頭像更換一次
更換成這個,再來看一下img 文件夾
原來的文件被刪除,只保存當下的文件,這樣可以避免占用多的內存
(繼續閱讀...)
文章標籤

AutoPoster 發表在 痞客邦 留言(0) 人氣(5)

  • 個人分類:生活學習
▲top
«1...222324230»

pop-under

參觀人氣

  • 本日人氣:
  • 累積人氣:

線上人數

Marquee

最新文章

  • 文章列表
  • jvm系列(四):jvm調優-命令大全(jps jstat jmap jhat jstack jinfo)
  • spring boot(一):入門篇
  • jvm系列(一):java類的加載機制
  • jvm系列(三):java GC算法 垃圾收集器
  • spring boot 實戰:我們的第一款開源軟件
  • jvm系列(六):jvm調優-從eclipse開始
  • 混合應用技術選型
  • jvm系列(二):JVM內存結構
  • spring boot(五):spring data jpa的使用

熱門文章

  • (1,763)jQuery之前端國際化jQuery.i18n.properties
  • (1,001)Oracle Hint
  • (630)技術筆記:Indy控件發送郵件
  • (515)linux下安裝sqlite3
  • (501)學習筆記: Delphi之線程類TThread
  • (242)VC單選按鈕控件(Radio Button)用法(轉)
  • (104)單條件和多條件查詢
  • (51)淺談config文件的使用
  • (22)基于 Asp.Net的 Comet 技術解析
  • (15)Java中的抽象類

文章分類

  • 生活學習 (2,296)
  • 未分類文章 (1)

最新留言

  • [20/04/24] 我是女生想約炮 有男生願意給我溫暖的嗎?我賴是woyou58 於文章「(1)從底層設計,探討插件式GIS框架的...」留言:
    我叫黎兒女生最近內心掙扎著要不要約炮我的line:woy...

文章搜尋

文章精選

誰來我家

Live Traffic Feed