JavaScript
May 28, 2019
▼加在一般 html 方法,以下的「輸入內容」要同時輸入兩邊。
說明:使用onfocus 事件,檢查value的內容,如果是初始內容,就將內容清空
▼DEMO try it:
說明:使用onfocus 事件,檢查value的內容,如果是初始內容,就將內容清空
<input type="text" value="輸入內容" onfocus="javascript:if(this.value=='輸入內容')this.value='';">
▼DEMO try it:
April 12, 2015
同時秀出價格
同時秀出價格
CSS (head)
/*隱藏區塊用*/
.box{display: none;}
/*秀出區塊用*/
.bS01{}
.bS02{}
.bS03{}
/*區塊範圍指定*/
.bBW{}
.box{display: none;}
/*秀出區塊用*/
.bS01{}
.bS02{}
.bS03{}
/*區塊範圍指定*/
.bBW{}
JavaScript (head)
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('input[type="radio"]').click(function(){
if($(this).attr("value")=="bOne"){
$(".box").hide();
$(".bS01").show();
}
if($(this).attr("value")=="bTwo"){
$(".box").hide();
$(".bS02").show();
}
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$('input[type="radio"]').click(function(){
if($(this).attr("value")=="bOne"){
$(".box").hide();
$(".bS01").show();
}
if($(this).attr("value")=="bTwo"){
$(".box").hide();
$(".bS02").show();
}
});
});
</script>
March 12, 2015
CSS部分
javascript 部分
html 部分
<style type="text/css">
span{border:#999 solid 1px; padding:3px; border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px;}
div#show{ margin:10px 0 0 0; padding:5px; border:#999 dashed 1px;}
</style>
span{border:#999 solid 1px; padding:3px; border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px;}
div#show{ margin:10px 0 0 0; padding:5px; border:#999 dashed 1px;}
</style>
javascript 部分
<script type='text/javascript'>
function show(obj, id)
{
var o=document.getElementById(id);
if( o.style.display == 'none' )
{
o.style.display='';
obj.innerHTML='隱藏';
}
else
{
o.style.display='none';
obj.innerHTML='顯示';
}
}
</script>
function show(obj, id)
{
var o=document.getElementById(id);
if( o.style.display == 'none' )
{
o.style.display='';
obj.innerHTML='隱藏';
}
else
{
o.style.display='none';
obj.innerHTML='顯示';
}
}
</script>
html 部分
<span onclick='show(this, "show")'>顯示</span><br>
<div id='show' style="display:none;">按下文字按鈕後呈現內容</div>
<div id='show' style="display:none;">按下文字按鈕後呈現內容</div>
March 8, 2015
css部分
javascript部分
html部分
註:show可以任意改為其他文字
<style type="text/css">
div#show{ margin:10px 0 0 0; padding:5px; border:#999 dashed 1px;}
</style>
div#show{ margin:10px 0 0 0; padding:5px; border:#999 dashed 1px;}
</style>
javascript部分
<script type="text/javascript">
<!--
function show(obj,item){
document.getElementById(item).style.display = obj.checked?"block":"none";
}
//-->
</script>
<!--
function show(obj,item){
document.getElementById(item).style.display = obj.checked?"block":"none";
}
//-->
</script>
html部分
<input type="checkbox" onclick="show(this,'show');" />
<div id="show" style="display:none">這是顯示的內容</div>
<div id="show" style="display:none">這是顯示的內容</div>
註:show可以任意改為其他文字
June 19, 2014
<script type="text/javascript">
function checkserAgent(){
var userAgentInfo=navigator.userAgent;
var userAgentKeywords=new Array(“Android", “iPhone" ,"SymbianOS", “Windows Phone", “iPad", “iPod", “MQQBrowser");
var flag=false;
if(userAgentInfo.indexOf(“Windows NT")==-1){
flag=true;
}
return flag;
}
if(checkserAgent()){
document.location.href="http://www.apao.idv.tw/mobile/";
}
</script>
function checkserAgent(){
var userAgentInfo=navigator.userAgent;
var userAgentKeywords=new Array(“Android", “iPhone" ,"SymbianOS", “Windows Phone", “iPad", “iPod", “MQQBrowser");
var flag=false;
if(userAgentInfo.indexOf(“Windows NT")==-1){
flag=true;
}
return flag;
}
if(checkserAgent()){
document.location.href="http://www.apao.idv.tw/mobile/";
}
</script>
August 25, 2012
<script LANGUAGE="JavaScript">
<!--
function openwin() {
window.open ("page.html", "newwindow", "height=100, width=400, toolbar =no, menubar=no, scrollbars=no, resizable=no, location=no, status=no") file://写成一行
}
//-->
</script>
window.open 談出新視窗的命令文;
'page.html' 弹出窗口的文件名;
'newwindow' 彈出窗口的名字(不是文件名),可空白' ';
height=100 窗口高度;
width=400 窗口寬度;
top=0 窗口距離瀏覽器上方的距離值;
left=0 窗口距離瀏覽器左側的距離值;
toolbar=no 是否顯示工具欄,yes為顯示;
menubar,scrollbars 表示清單與滾動軸。
resizable=no 是否可改變視窗大小,yes为允許;
location=no 是否显示地址栏,yes为允许;
status=no 是否顯示狀態欄內的訊息(指是視窗開啟時),yes為允許;
html+javascript的寫法:
<html>
<head>
<script LANGUAGE="JavaScript">
<!--
function openwin() {
window.open ("page.html", "newwindow", "height=100, width=400, toolbar =no, menubar=no, scrollbars=no, resizable=no, location=no, status=no") //要寫成一行
}
//-->
</script>
</head>
<body onload="openwin()">
任意的頁面內容...
</body>
</html>
<head>
<script LANGUAGE="JavaScript">
<!--
function openwin() {
window.open ("page.html", "newwindow", "height=100, width=400, toolbar =no, menubar=no, scrollbars=no, resizable=no, location=no, status=no") //要寫成一行
}
//-->
</script>
</head>
<body onload="openwin()">
任意的頁面內容...
</body>
</html>
開啟新增視窗方法有四種:
方法一:
<body onload="openwin()"> 瀏覽器開啟時(讀取時)彈出視窗;
方法二:
<body onunload="openwin()"> 瀏覽器離開頁面時(不讀取)彈出視窗;
方法三:用一个连接调用:
<a href="#" onClick="window.open('URL', 'Joseph', config='height=350,width=440')"/>開啟一個新視窗</a>
注意:必須使用“#”
方法四:用於發布按鈕時:
<input type="button" onclick="openwin()" value="開啟視窗">
<body onload="openwin()"> 瀏覽器開啟時(讀取時)彈出視窗;
方法二:
<body onunload="openwin()"> 瀏覽器離開頁面時(不讀取)彈出視窗;
方法三:用一个连接调用:
<a href="#" onClick="window.open('URL', 'Joseph', config='height=350,width=440')"/>開啟一個新視窗</a>
注意:必須使用“#”
方法四:用於發布按鈕時:
<input type="button" onclick="openwin()" value="開啟視窗">