整合營銷服務商

          電腦端+手機端+微信端=數據同步管理

          免費咨詢熱線:

          PHP筆記(二) HTML表單

          多數PHP程序都使用HTML表單從用戶那里獲取數據并計算結果。

          HTML表單的一些基本原則

          • 選擇適合于收集的數據類型和提供交互方式的控件。
          • 清楚標記每一個控件,這樣用戶就可以理解其功能。
          • 盡可能將標簽對齊。將控件的左邊緣對齊。
          • 將相關的標簽分組,并且通過設計中使用空白將每一個分組分開。
          • 表單上的控件順序應該類似于用戶操作他們的順序。

          創建基本HTML表單

          首先創造一個基本的HTML大綱,包含表單控件;然后將控件進行合并(HTML表單必須包括一個提交按鈕,用戶單擊它可以將表單數據發送到服務器。)一個單獨的HTML頁面可以包含多個表單。

          • 創建HTML結構

          包含表單的HTML結構和和普通的HTML結構一樣。

          <HTML>
            <HEAD>
            <TITLE>標題放在這</TITLE>
            </HEAD>
          <BODY>
            表單頁面放在這
            </BODY>
            </HTML>

          在包含表單的HTML頁面中可以使用任何HTML標簽。基本的表單使用FROM標簽來說明。該標簽中METHOD屬性接收GET或POST兩個值中的一個。ACTION屬性子明PHP腳本的url,該腳本可以收集通過表單收集的數據,可以是絕對路徑或者相對路徑

          <FORM METHOD="method" ACTION="url"> 
            中間可以放置表單控件
            </FORM>
          • 合并控件

          兩個常用的基本控件:文本框和提交按鈕。

          文本框:允許用戶鍵入信息以發送給PHP腳本。NAME屬性為文本提供名稱,PHP腳本可以通過名稱準確訪問其內容,因此它應該是唯一的且符合PHP變量命名規則(但不需要$符號),單標簽。VALUE屬性指明出現在提交按鈕上面的標題。創建方式如下:

          <INPUT TYPE = "TEXT" NAME="text">

          提交按鈕:允許用戶將一個表單的內容發送到服務器,一個HTML表單對應應該有一個提交按鈕。

          示例:一個完整的HTML表單。

          <HTML>
            <HEAD>
            <TITLE>標題</TITLE>
            </HEAD>
          <BODY>
          <FORM METHOD="POST" ACTION="phpinfo.php">
          <INPUT TYPE="TEXT" NAME="user_name">
          <BR/>
          <BR/>
          <INPUT TYPE="TEXT" NAME="user_email">
          <BR/>
          <BR/>
          <INPUT TYPE="SUBMIT" VALUE="Send the Data">
          </FORM>
            </BODY>
            </HTML>


          • 使用多個表單

          可以在一個HTML頁面中包含多個表單,注意下一個表單的FORM開始之前需要結束前一個FORM表單。

          <HTML>
            <HEAD>
            <TITLE>標題</TITLE>
            </HEAD>
          <BODY>
            
          <FORM METHOD="POST" ACTION="phpinfo.php">
          <INPUT TYPE="TEXT" NAME="user_name">
          <BR/>
          <BR/>
          <INPUT TYPE="TEXT" NAME="user_email">
          <BR/>
          <BR/>
          <INPUT TYPE="SUBMIT" VALUE="Send the Data">
          <BR/>
          <BR/>
          </FORM>
          
          <FORM METHOD="POST" NAME="phpinfo.php">
          <INPUT TYPE="TEXT" NAME="user_name1">
          <BR/>
          <BR/>
          <INPUT TYPE="TEXT" NAME="user_email1">
          <BR/>
          <BR/>
          <INPUT TYPE="SUBMIT" VALUE="Send the Data1">
          </FORM>
          
            </BODY>
            </HTML>


          創建表單控件

          • 創建自定義的文本框

          文本框的屬性中,TYPE和NAME是必須的,其余是可選屬性。SIZE屬性用于設置文本框的可視大小;MAXLENGTH指明用戶鍵入字符的最大長度;VALUE給出了一個最初顯示在文本框中的值。

          <input type="text" name="" size="" maxlength="" value="">
          • 創建文本區域

          文本區域可以輸入多行文本。NAME和ROWS屬性是必須的。ROWS屬性表明了文本區域內可以看到的文本行數,充滿時會滾動。COLS屬性指明可見文本列數與行數類似。WRAP屬性指明文本區域內單詞換行的方式,可以指定如下值。該標簽為雙標簽。

          說明

          off

          禁止單詞換行但用戶可以輸入換行符強制換行

          virtual/soft

          各行顯示為換行,但是換行并沒有被發送到服務器

          physica/hard

          啟用了單詞換行

          <inputarea name="" rows="" cols="" wrap="">
          • 創建密碼框

          創建密碼框的語法與文本框相同,但要將TYPE屬性指定為PASSWORD而不是TYPE。

          <input type="password" name="" size="" maxlength="" value="">
          • 創建復選框

          取兩個值中的一個,即二選一。TYPE屬性是必須的,checked屬性出現,該復選框默認情況會被選定。value屬性指定復選框被選定情況下被發送到服務器的值,默認發送on值。法如下:

          <input type="checkbox" name="" checked value="">
          • 創建單選按鈕

          語法與復選框屬性含義相同,但是TYPE屬性的值必須是RADIO,NAME屬性是必須的。

          <input type="radio" name="" checked value="">
          • 創建列表框

          用戶可以選擇一個或者多個選項,它是一個滾動菜單。

          <select name="" multipile size="">options go here</select>

          name屬性是必須的,multipile屬性指明用戶可以通過按下crtl鍵并單擊多個選項來選擇它們

          列表框的單選行為可作為單選按鈕。

          <option selected value="text"></options>
          • 創建隱藏域
          <input type="hidden" name="text"value="">
          • 實現上傳文件的HTML表單
          <input type="FILE" name="name" accept="time" value="text">

          其中type屬性是必須的。格式通過使用MIME碼指定。常用的格式如下:


          超文本標記語言文本 .html,.html text/html

            普通文本 :txt text/plain

            word文檔:application/msword

            RTF文本 :rtf application/rtf

            GIF圖形 :gif image/gif

            JPEG圖形 :jpeg,

            jpg: image/jpeg

            au聲音文件:au audio/basic

            MIDI音樂文件 :mid,.midi audio/midi,audio/x-midi

            RealAudio音樂文件 .ra, .ram audio/x-pn-realaudio

            MPEG文件 .mpg,.mpeg video/mpeg

            AVI文件 .avi video/x-msvideo

            GZIP文件 .gz application/x-gzip

            壓縮文件.rar application/octet-stream

            壓縮文件.zip application/x-zip-compressed

            TAR文件 .tar application/x-tar


          更多提交表單的信息

          • 使用圖像提交數據
          <input type="image" src="url" name="text" align="align">
          • 創建重置按鈕
          <input type="reset" value="text">

          、jQuery的事件有哪些?

          javscript的事件:onClick,onmouseover

          jquery的事件:click,mouseover

          注意jQuery的事件比javascript的事件少一個on

          1)鼠標事件

          click:單擊事件

          //dbclick:雙擊事件

          mouseover:鼠標懸念(移入)

          mouseout:鼠標移出

          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9

          <style>

          .abc{

          background-color: #aaa;

          }

          </style>

          <script type="text/javascript">

          $(function(){

          $("#nav li").mouseover(function(){

          $(this).addClass("abc");//當鼠標移入li元素時添加樣式

          }).mouseout(function(){

          //$(this).removeClass() //當鼠標移出時刪除所有樣式

          $(this).removeClass("abc") //當鼠標移出時刪除指定樣式

          });

          });

          </script>

          <div id="nav">

          <ul>

          <li><a href="#">首頁</a></li>

          <li><a href="#">服裝</a></li>

          <li><a href="#">電器</a></li>

          <li><a href="#">團購</a></li>

          <li><a href="#">在線瀏覽</a></li>

          </ul>

          </div>

          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12
          • 13
          • 14
          • 15
          • 16
          • 17
          • 18
          • 19
          • 20
          • 21
          • 22
          • 23
          • 24
          • 25
          • 26

          2) 鍵盤事件

          keydown:鍵盤按下事件

          keypress:鍵盤按下并放開時觸發

          keydown:鍵盤放開時觸發

          • 1
          • 2
          • 3
          • 4
          • 5

          <script type="text/javascript">

          $(function(){

          //按回車鍵自動登錄(不用再點擊登錄按鈕)

          $(document).keydown(function(event){

          if(event.keyCode==13){

          $("#actionForm").submit();

          return true;

          }

          return false;

          })

          });

          </script>

          <form id="actionForm" action="../index.html">

          登錄名:<input id="txtLoginName" /><br />

          密碼:<input type="password" />

          <input type="button" value="登錄" />

          </form>

          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12
          • 13
          • 14
          • 15
          • 16
          • 17
          • 18

          3) 表單事件

          focus:獲得焦點時觸發

          blur:失去焦點

          select:文本選中時觸發

          • 1
          • 2
          • 3
          • 4
          • 5

          <script type="text/javascript">

          $(function(){

          //文本框獲得焦點時,將當前文本框的內容清空(值等于"請輸入登錄名..")

          //文本框失去焦點時,判斷內容是否為"請輸入登錄名.."或是否為空,那么將這個值"請輸入登錄名.."設回到文本框

          $("#txtLoginName").focus(function(){

          if($(this).val()=='請輸入登錄名...'){

          $(this).val('');//清空內容

          }

          }).blur(function(){

          if($(this).val().trim()==''){

          $(this).val('請輸入登錄名...');//清空內容

          }

          });

          });

          </script>

          <form id="actionForm" action="../index.html">

          登錄名:<input id="txtLoginName" value="請輸入登錄名..." /><br />

          密碼:<input type="password" />

          <input type="button" value="登錄" />

          </form>

          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12
          • 13
          • 14
          • 15
          • 16
          • 17
          • 18
          • 19
          • 20
          • 21
          • 22

          4)其它事件

          bind():綁定事件

          unbind():移除綁定事件

          • 1
          • 2
          • 3
          • 4

          <script type="text/javascript">

          $(function(){

          //綁定單個事件

          // $("#btn1").bind('click',function(){

          // alert("OK");

          // });

          //綁定多個事件

          $("#btn1").bind({

          mouseover:function(){

          alert("鼠標懸念");

          },

          mouseout:function(){

          alert("鼠標移出");

          }

          })

          //解除綁定事件

          $("#btn2").click(function(){

          //$("#btn1").unbind("click");//解除綁定的單個事件

          $("#btn1").unbind("mouseover mouseout");//解除多個綁定的事件,用空格分隔

          //$("#btn1").unbind();//解除所有綁定的事件

          });

          });

          </script>

          <input type="button" id="btn1" value="點我" /><br />

          <input type="button" id="btn2" value="解除綁定" />

          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12
          • 13
          • 14
          • 15
          • 16
          • 17
          • 18
          • 19
          • 20
          • 21
          • 22
          • 23
          • 24
          • 25
          • 26

          hover():相當于mouseover和mouseout的組合

          • 1
          • 2

          .abc{

          background-color: #aaa;

          }

          </style>

          <script type="text/javascript" src="../js/jquery-1.8.3.js" ></script>

          <script type="text/javascript">

          $(function(){

          // $("#nav li").mouseover(function(){

          // $(this).addClass("abc");//當鼠標移入li元素時添加樣式

          // }).mouseout(function(){

          // //$(this).removeClass() //當鼠標移出時刪除所有樣式

          // $(this).removeClass("abc") //當鼠標移出時刪除指定樣式

          // });

          $("#nav li").hover(

          function(){

          $(this).addClass("abc");//當鼠標移入li元素時添加樣式

          },

          function(){

          $(this).removeClass("abc") //當鼠標移出時刪除指定樣式

          }

          );

          });

          </script>

          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12
          • 13
          • 14
          • 15
          • 16
          • 17
          • 18
          • 19
          • 20
          • 21
          • 22
          • 23
          • 24
          • 25

          togger():

          a) 鼠標連續點擊

          b) 顯示和隱藏

          • 1
          • 2
          • 3
          • 4

          <script type="text/javascript">

          $(function(){

          //點擊當前頁面時顯示紅綠藍的背景色

          $("body").toggle(

          function(){

          $(this).css("background-color","red");

          },

          function(){

          $(this).css("background-color","green");

          },

          function(){

          $(this).css("background-color","blue");

          }

          );

          });

          </script>

          </head>

          <body>

          測試

          </body>

          .說明:

          推薦指數:★★★★

          通俗易懂,小白一看就會,高手請飄過。

          學python也是需要懂一點Html、Css、JavaScript的基礎知識的。

          建議使用vscode編輯器。


          2.效果圖1


          3.代碼:保存為html,用瀏覽器打開即可。

          <!DOCTYPE html>
          <html>
          	<head>
          		<meta charset="UTF-8">
          		<title>圓形百分比進度條效果</title>
          		<style type="text/css">
          		*{
          			margin: 0;
          			padding: 0;
          		}
          		.bg{
          			width: 200px;
          			height: 200px;
          			border-radius: 100%;
          			background: #ccc;
          			position: relative;
          			margin: 20px auto;
          		}
          		.circle-right, .circle-left, .mask-right, .mask-left{
          			width: 200px;
          			height: 200px;
          			border-radius: 100%;
          			position: absolute;
          			top: 0;
          			left: 0;
          		}
          		.circle-right, .circle-left{
          			background: skyblue;
          		}
          		.mask-right, .mask-left{
          			background: #ccc;
          		}
          		.circle-right, .mask-right{
          			clip: rect(0,200px,200px,100px);
          		}
          		.circle-left, .mask-left{
          			clip: rect(0,100px,200px,0);
          		}
          		.text{
          			width: 160px;
          			height: 160px;
          			line-height: 160px;
          			text-align: center;
          			font-size: 34px;
          			color: deepskyblue;
          			border-radius: 100%;
          			background: #fff;
          			position: absolute;
          			top: 20px;
          			left: 20px;
          		}
          		</style>
          	</head>
          	<body>
          		<div class="bg">
          			<div class="circle-right"></div>
          			<!--100%是顯示百分數,動態顯示由0~100-->
          			<div class="text">100%</div> 
          
          		</div>
          		
          		<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
          		<script type="text/javascript">
          			$(function(){				
          				//獲取百分比值
          				var num = parseInt($('.text').html());
          				
          				//通過計時器來顯示過渡的百分比進度
          				var temp = 0;
          				var timer = setInterval(function(){
          					calculate(temp);
          					//清除計時器結束該方法調用
          					if(temp == num){
          						clearInterval(timer);
          					}
          					temp++;
          				},30)
          
          				//改變頁面顯示百分比
          				function calculate(value){
          					//改變頁面顯示的值
          					$('.text').html(value + '%');
          					
          					//清除上次調用該方法殘留的效果
          					$('.circle-left').remove();
          					$('.mask-right').remove();
          					
          					//當百分比小于等于50
          					if(value <= 50){
          						var html = '';
          						
          						html += '<div class="mask-right" style="transform:rotate('+ (value * 3.6) +'deg)"></div>';
          						
          						//元素里添加子元素
          						$('.circle-right').append(html);
          					}else{
          						value -= 50;
          						var html = '';
          						
          						html += '<div class="circle-left">';
          						html += '<div class="mask-left" style="transform:rotate('+ (value * 3.6) +'deg)"></div>';
          						html += '</div>';
          						
          						//元素后添加元素
          						$('.circle-right').after(html);
          					}
          				}
          			})
          		</script>
          		
          	</body>
          </html>

          4.拆分法:把一個含有css和js(JavaScript)的html,拆掉三個文件,一個叫cirbar1.html,另外的叫:cirbar1.css和cirbar1.js文件,放在同一個文件夾內。這是./的意思,也可以指定文件夾。

          4.1 cirbar1.html的代碼:

          <!DOCTYPE html>
          <html>
          	<head>
          		<meta charset="UTF-8">
          		<title>圓形百分比進度條效果v2</title>
          		<!--如果是style type="text/css"這種直接在html中設置css,注意起始是*,不是點-->
          		<!--style type="text/css"-->
          		<link href="./cirbar1.css" rel="stylesheet" />
          	</head>
          	<body>
          		<div class="bg">
          			<div class="circle-right"></div>
          			
          			<div class="text">100%</div> 
          		</div>
          		<!--這個外部js文件=jquery.min.js,不能少,否則不能動了-->
          		<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"--></script>
                  <!--同樣的,把寫在html的js,新建一個cirbar1.js,復制下去,保存,這樣子簡潔很多-->
          		<!--script type="text/javascript"-->
          		<script src="./cirbar1.js"></script>
          	</body>
          </html>

          4.2 cirbar1.css的代碼:

          		*{
          			margin: 0;
          			padding: 0;
          		}
          		.bg{
          			width: 200px;
          			height: 200px;
          			border-radius: 100%;
          			background: #ccc;
          			position: relative;
          			margin: 20px auto;
          		}
          		.circle-right, .circle-left, .mask-right, .mask-left{
          			width: 200px;
          			height: 200px;
          			border-radius: 100%;
          			position: absolute;
          			top: 0;
          			left: 0;
          		}
          		.circle-right, .circle-left{
          			background: skyblue;
          		}
          		.mask-right, .mask-left{
          			background: #ccc;
          		}
          		.circle-right, .mask-right{
          			clip: rect(0,200px,200px,100px);
          		}
          		.circle-left, .mask-left{
          			clip: rect(0,100px,200px,0);
          		}
          		.text{
          			width: 160px;
          			height: 160px;
          			line-height: 160px;
          			text-align: center;
          			font-size: 34px;
          			color: deepskyblue;
          			border-radius: 100%;
          			background: #fff;
          			position: absolute;
          			top: 20px;
          			left: 20px;
          		}

          4.3 cirbar1.js的代碼:

          			$(function(){				
          				//獲取百分比值
          				var num = parseInt($('.text').html());
          				
          				//通過計時器來顯示過渡的百分比進度
          				var temp = 0;
          				var timer = setInterval(function(){
          					calculate(temp);
          					//清除計時器結束該方法調用
          					if(temp == num){
          						clearInterval(timer);
          					}
          					temp++;
          				},30)
          
          				//改變頁面顯示百分比
          				function calculate(value){
          					//改變頁面顯示的值
          					$('.text').html(value + '%');
          					
          					//清除上次調用該方法殘留的效果
          					$('.circle-left').remove();
          					$('.mask-right').remove();
          					
          					//當百分比小于等于50
          					if(value <= 50){
          						var html = '';
          						
          						html += '<div class="mask-right" style="transform:rotate('+ (value * 3.6) +'deg)"></div>';
          						
          						//元素里添加子元素
          						$('.circle-right').append(html);
          					}else{
          						value -= 50;
          						var html = '';
          						
          						html += '<div class="circle-left">';
          						html += '<div class="mask-left" style="transform:rotate('+ (value * 3.6) +'deg)"></div>';
          						html += '</div>';
          						
          						//元素后添加元素
          						$('.circle-right').after(html);
          					}
          				}
          			})

          ==============================

          再來一個,不用外部js文件的圓形進度條

          順帶回顧一下相關知識。

          ==============================

          5.效果圖


          6.三個文件,放在同一個文件夾中

          6.1 cirbar.html代碼:

          <!--第1步---聲明html5-->
          <!DOCTYPE html> 
          
          <!--第2步---html大框架-->
          <html lang="en">
          
          <!--第2-1步---head部分-->
          <head>
              <!--第2-1-1步---meta部分:聲明字符編碼格式:utf-8-->
              <!--注意與python的第一行聲明一樣:# -*- coding: utf-8 -*-->
              <meta charset="utf-8" />
              <!--第2-1-2步---標題名稱-->
              <title>圓形進度條v1</title>
              <!--注意:./代表同一個文件夾下,也就是css和js文件與本html文件放在同一個文件夾下-->
              <!--第2-1-3步---導入css文件-->
              <link href="./cirbar.css" rel="stylesheet" />
          </head>
          
          <!--第2-2步---body部分-->
          <body>
              <!--第2-2-1步---定義畫布部分,注意沒有逗號隔開,大小設置-->
              <canvas class="canvas" id="canvas" width="400" height="400"></canvas>
              <!--第2-2-2步---導入js文件部分-->
              <script src="./cirbar.js"></script>
          
          <!--注意收尾-->
          </body>
          <!--注意收尾-->
          </html>

          6.2 cirbar.css代碼:

          .canvas {
                      /*畫布的背景顏色設置為:黑色*/
                      background:#303030;
                      
                  }

          6.3 cirbar.js代碼:

          window.onload = function () {
                      var canvas = document.getElementById('canvas'),  //獲取canvas元素
                          context = canvas.getContext('2d'),  //獲取畫圖環境,指明為2d
                          centerX = canvas.width / 2,   //Canvas中心點x軸坐標
                          centerY = canvas.height / 2,  //Canvas中心點y軸坐標
                          rad = Math.PI * 2 / 100, //將360度分成100份,那么每一份就是rad度
                          speed = 0.1; //加載的快慢就靠它了
                      //繪制紅色外圈
                      function blueCircle(n) {
                          context.save();
                          context.strokeStyle = "	#1E90FF"; //隨百分數轉動的外圈的顏色為藍色
                          context.lineWidth = 3; //設置線寬
                          context.beginPath(); //路徑開始
                          //注意-為順時針,+為逆時針
                          //用于繪制圓弧context.arc(x坐標,y坐標,半徑,起始角度,終止角度,順時針/逆時針)
                          //context.arc(centerX, centerY, 50, Math.PI / 2, Math.PI / 2 - n * rad, false); 
                          context.arc(centerX, centerY, 50, -Math.PI / 2, -(Math.PI / 2 - n * rad), false); 
                          context.stroke(); //繪制
                          context.closePath(); //路徑結束
                          context.restore();
                      }
                      //繪制白色外圈,初始的白色外圈
                      function whiteCircle() {
                          context.save();
                          context.beginPath();
                          // 下面百分數的字體顏色設置后上面的外圈的顏色竟然保持一樣
                          //context.strokeStyle = "#F8F8FF";
                          context.arc(centerX, centerY, 50, 0, Math.PI * 2, false);
                          context.stroke();
                          context.closePath();
                          context.restore();
                      }
                      //百分比文字繪制
                      function text(n) {
                          context.save(); //save和restore可以保證樣式屬性只運用于該段canvas元素
                          context.strokeStyle = "#7FFF00";//設置中間動態百分數的顏色
                          context.font = "25px Arial"; //設置字體大小和字體
                          context.textAlign = 'center';//字體水平居中
                          context.textBaseline = 'middle';//字體垂直居中
                          //繪制字體,并且指定位置
                          context.strokeText(n.toFixed(0) + "%", centerX, centerY);
                          context.stroke(); //執行繪制
                          context.restore();
                      }
                      //循環獲取
                      (function drawFrame() {
                          window.requestAnimationFrame(drawFrame, canvas);
                          context.clearRect(0, 0, canvas.width, canvas.height);
                          whiteCircle();
                          text(speed);
                          blueCircle(speed);
                          if (speed < 100) {
                              //1可從后臺獲取值,也是從0~100,step為1,代表速度
                              speed += 1;
                          }
                      }());
                  }

          注意到6.3js文件與4.3js文件的區別了么?一個有:window.onload =,一個沒有,且只有$和小括號,因為外部的就是文件定義了一部分功能。


          主站蜘蛛池模板: 日韩精品一区二区三区色欲AV | 国产一区二区三区在线观看影院| 国产Av一区二区精品久久| 一区二区免费电影| 久久精品国产AV一区二区三区| 视频在线观看一区二区三区| 亚洲AV无码一区二区三区电影| 少妇精品久久久一区二区三区| 岛国精品一区免费视频在线观看| 国产成人av一区二区三区不卡| 精品亚洲av无码一区二区柚蜜| 亚洲视频一区在线观看| 日韩精品成人一区二区三区| 中文字幕亚洲一区| 午夜无码一区二区三区在线观看| 国产精品一区二区三区高清在线| 亚洲精品日韩一区二区小说| 国产精品一区在线播放| 成人免费观看一区二区| 无码人妻精品一区二区三区蜜桃 | 国产一区在线mmai| 国产一区在线mmai| 亚洲av色香蕉一区二区三区蜜桃| 无码av免费毛片一区二区| 国产福利一区二区三区| 中文乱码人妻系列一区二区| 波多野结衣一区二区| 天堂一区二区三区精品| 日韩成人一区ftp在线播放| 国产视频福利一区| 亚洲国产av一区二区三区| 国产美女av在线一区| 中文字幕一区二区三区日韩精品| 国产午夜精品一区二区三区漫画 | 国产在线观看一区精品| 国产精品一区二区久久国产| 一区二区视频在线观看| 亚洲日韩精品国产一区二区三区| 日韩精品中文字幕视频一区 | 无码人妻啪啪一区二区| 国产三级一区二区三区|