整合營銷服務商
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
是否有看到有的網(wǎng)站進入網(wǎng)站就會彈出網(wǎng)站公告提示框，今天飛飛和你們分享打開網(wǎng)站就彈出網(wǎng)站公告提示框的JS彈窗代碼，希望可以幫到你~
<script language="javascript">alert('我是飛飛，可以通過【服務器大本營】相識是一種緣分，希望通過我的分享可以讓你更多的了解服務器，當然有服務器需求的朋友可以加微信：137 5120 9102~域名速記：【服務器大本營】首拼.com')</script>
直接復制JS代碼，粘貼到首頁文件，或者需要彈出的頁面即可
錄
1.警告彈窗
2.確認彈窗
3.提示彈窗
1.警告彈窗 alert();
警告框經(jīng)常用于確保用戶可以得到某些信息。
當警告框出現(xiàn)后，用戶需要點擊確定按鈕才能繼續(xù)進行操作。
例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
function myFunction(){
alert("hello");
}
</script>
</head>
<body>
<input type="button" onclick="myFunction()" value="警告" />
</body>
</html>
此代碼運行成功后,若點擊"警告"按鈕 會出現(xiàn)內(nèi)容顯示為"hello"的彈窗.
2.確認彈窗 confirm();
確認彈框通常用于驗證是否接受用戶操作。
當確認卡彈出時，用戶可以點擊 "確認" 或者 "取消" 來確定用戶操作。
當你點擊 "確認", 確認框返回 true， 如果點擊 "取消", 確認框返回 false。
例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>練習</title>
</head>
<body>
<p>點擊按鈕，顯示確認框。</p>
<button onclick="myFunction()">點這里</button>
<p id="demo"></p>
<script>
function myFunction(){
var x;
var r=confirm("你確定?");
if (r==true){
x="你按下了確定按鈕";
}
else{
x="你選擇了取消";
}
document.getElementById("demo").innerHTML=x;
}
</script>
</body>
</html>
點擊按鈕后會出現(xiàn)確認彈框"你確定?"
點擊"確定"會提示"你按下了確定按鈕";
否則會提示"你選擇了取消";
3.提示彈窗 prompt()
提示框經(jīng)常用于提示用戶在進入頁面前輸入某個值。
當提示框出現(xiàn)后，用戶需要輸入某個值，然后點擊確認或取消按鈕才能繼續(xù)操縱。
如果用戶點擊確認，那么返回值為輸入的值。如果用戶點擊取消，那么返回值為 null。
例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>練習</title>
</head>
<body>
<button onclick="myFunction()">點這里</button>
<p id="demo"></p>
<script>
function myFunction(){
var x;
var person=prompt("請輸入你的名字","jack");
if (person!=null && person!=""){
x="你好 " + person;
document.getElementById("demo").innerHTML=x;
}
}
</script>
</body>
</html>
點擊按鈕后會出現(xiàn)提示輸入你的名字
輸入后點擊確定會出現(xiàn)
"jack你好 "
希望本文所述對大家vue.js程序設計有所幫助。
歡迎大家多多留言討論，如有錯誤請大神指教，如果你是小白也可以私信“資料”領取前端學習資料一起學習
次在講css實現(xiàn)tab切換時，有童靴留言說可以使用錨點實現(xiàn)，對的，就是可以使用錨點，然而，使用錨點涉及到的又有哪些關鍵技術了？今天我們以錨點實現(xiàn)彈窗為例來解答這個問題
一句話總結實現(xiàn)原理就是：a標簽改變hash值觸發(fā)css3偽類target作用對應id的dom元素。
：target是CSS里一個非常有趣的偽選擇器。它在CSS里發(fā)生作用的過程是這樣的：當瀏覽器地址里的hash（地址#號后面的部分）和：target偽選擇器指定的ID匹配上時，它的樣式就會在這個ID元素上生效。
實例dom結構：
dom結構比較簡單，兩個帶href為#id的a標簽，以及兩上對應#id后面id值作為自己id的p標簽。下面我們給偽元素定義一個樣式：
然后，我們點擊#news1時p#news1元素對這個樣式生效，點擊#news2時p#news2元素對這個樣式生效。（結論是：target選擇器會突出顯示當前活動的HTML錨）效果是這樣的：
好了，以上實現(xiàn)就是為了說明偽元素是這樣作用的，記住上面加粗語句就行了。下面來實現(xiàn)我們本篇要講的主題—錨點實現(xiàn)彈窗
知道target是怎么作用的了，那下面這個彈窗功能就好實現(xiàn)了。
實現(xiàn)的dom結構：
由上圖可知，兩個帶href#id的a標簽，和兩個id等于#id的dom結構。運行效果是這樣的：
給target偽類定義樣式：
這個樣式的作用是將dom從不顯示變成顯示。
當我們點擊“點擊我”按鈕時，通過錨點改變hash值在通過偽類target將id="popup1"的dom添加偽類定義的樣式。結果是這樣的：
當點擊浮層上的叉時，關閉這個浮層，原理也是一樣的（改變hash引起偽類失效）。
當我們點擊“也點擊我嘛”按鈕時，同樣通過錨點改變hash值在通過偽類target將id="popup2"的dom添加偽類定義的樣。效果是這樣的：
只是這種情況將設置關閉的div.cancel設置成了全局寬度，層級在浮層下。所以通過點擊浮層外的區(qū)域就關閉了浮層，關閉原理是一樣的。
CSS3的target這個屬性，雖然所有的主流瀏覽器都支持，除了IE8及以下的版本，但是現(xiàn)在使用這種技術的人還是比較少，其實，如果不是太注重動態(tài)效果，使用這種瀏覽器原生技術來修飾你的應用也是不錯的選擇。
短內(nèi)容，說完整事，哪怕只讀一篇也能學知識。點擊關注小鄭搞碼事，說的都是那堆代碼。謝謝您的鼓勵！
*請認真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。
