選擇器
$('element'):選出所有該 element 的節點 | $('p') :選出所有 <p> </p>的節點
$('#divId'):選出所有 <div id="divId"></div> 的節點
$('.divClass'):選出所有 <div class="divClass"></div> 的節點 $(".intro,.demo")
http://www.runoob.com/jquery/jquery-ref-selectors.html
https://ithelp.ithome.com.tw/articles/10197416
設置器
$('#lable1).text( 將更新的內容 ):替換lable1的內容
$('#textbox1).val( 將更新的內容 ):替換textbox1的內容
ListBox選單操作
在設計頁面的原始檔
<asp:ListBox ID="ListBox1" runat="server">
<asp:ListItem>AAAAA</asp:ListItem>
<asp:ListItem>BBBBB</asp:ListItem>
<asp:ListItem>CCCCC</asp:ListItem>
</asp:ListBox>
在客戶端執行頁面的原始檔
<option value="AAAAA">AAAAA</option>
<option value="BBBBB">BBBBB</option>
<option value="CCCCC">CCCCC</option>
設動態增加Listbox選項
$('#ListBox1').change(function () {
var str=$(this).val());
$('#ListBox2').append('<option value=' + str + '>' + str + '</option>'); :在ListBox2新增Value=str的選項
});
獲取Listbox選擇的項目
$('#ListBox1').change(function () {
var str=$(this).val());
});
獲取Listbox的所有項目
var str="";
$('#ListBox2').find('option').each(function (){
str += $(this).val();
});
移至頁首
$('#gototop').click(function() {
$('html, body').animate({
scrollTop: 0
});
插入文本
$("#btn1").click(function(){
$("#gototop").append(" <b>插入文本</b>.");
}); 在id=gototop 插入<b>插入文本</b>
逾時執行
setTimeout(function() {
要執行的內容
}, 3500);
篩選及過濾
var dataset=[{id:'A01',name:'AA'} , {id:'A02',name:'BB'} , {id:'A03',name:'CC'}];
在JSON格式,[]為陣列,新增用=。
在JSON格式,{}為物件 ,新增用push。
以JSON進行篩選及過濾
欄位篩選
var newData = $.map(dataset, function(d,i) {
return d.name;
})
result:newData=['AA','BB','CC'];
條件篩選或過濾
var newData = $.grep(dataset, function(d,i) {
return d.name=='AA';
})
result:newData=['AA'];
dataset=[{id:'A01',name:'AA'},{id:'A02',name:'BB'},{id:'A03',name:'CC'}]
var newData = $.grep(dataset, function(d,i) {
return d.name!='AA';
})
result:newData=[[{id:'A02',name:'BB'}],{id:'A03',name:'CC'}];
var newData = $.grep(dataset, function(d,i) {
return (d.name!='AA'&&d.id!='A02');
})
result:newData=[{id:'A02',name:'BB'}];
陣列元素篩選
var dataset=[{id:'A01',name:'AA'} , {id:'A02',name:'BB'} , {id:'A03',name:'CC'}];
javascript離開迴圈的方法
var BreakException = {};
try {
if (x == false) { throw BreakException; }
}
catch (e) { if (e !== BreakException) throw e;}
取得目前按下第幾顆按鈕的順序
<script type="text/javascript">
function getindex(node) {
var index = Array.prototype.indexOf.call(node.parentNode.children, node);
alert(index);
}
</script>
<div>
<input type="button" name="test" value="test" onclick="getindex(this)"> <!--index 0-->
<input type="button" name="test" value="test" onclick="getindex(this)"> <!--index 1-->
<input type="button" name="test" value="test" onclick="getindex(this)"> <!--index 2-->
<input type="button" name="test" value="test" onclick="getindex(this)"> <!--index 3-->
</div>