1.javascript數組用法
| 方法 | 描述 | FF | IE |
|---|---|---|---|
| concat() | 連接兩個或更多的數組,並返回結果。 | 1 | 4 |
| join() | 把數組的所有元素放入一個字符串。元素通過指定的分隔符進行分隔。 | 1 | 4 |
| pop() | 刪除並返回數組的最后一個元素 | 1 | 5.5 |
| push() | 向數組的末尾添加一個或更多元素,並返回新的長度。 | 1 | 5.5 |
| reverse() | 顛倒數組中元素的順序。 | 1 | 4 |
| shift() | 刪除並返回數組的第一個元素 | 1 | 5.5 |
| slice() | 從某個已有的數組返回選定的元素 | 1 | 4 |
| sort() | 對數組的元素進行排序 | 1 | 4 |
| splice() | 刪除元素,並向數組添加新元素。 | 1 | 5.5 |
| toSource() | 返回該對象的源代碼。 | 1 | - |
| toString() | 把數組轉換為字符串,並返回結果。 | 1 | 4 |
| toLocaleString() | 把數組轉換為本地數組,並返回結果。 | 1 | 4 |
| unshift() | 向數組的開頭添加一個或更多元素,並返回新的長度。 | 1 | 6 |
| valueOf() | 返回數組對象的原始值 | 1 | 4 |
上邊列出來的就是JavaScript對數組對象的封裝,通過以上方法,可以輕松便捷的操作數組對象,引用網址:http://www.cnblogs.com/zyh-nhy/archive/2007/08/08/847876.html
2.checkbox
對於復選框來說,一般有一個固定的流程,許多的復選框都歸結於一個屬性,所以通常使用textbox或者label對象來存儲一族復選框的值,只需要把textbox或者label的屬性設置成hidden即可。在頁面傳參或者獲取參數時,只需要操作響應的textbox或者label即可。
例如:
<div id="crowd" class="checkbox_bgfl">
<input name="crowd" type="hidden"/>
<p><inputtype="checkbox" value="137"/><span>老人</span></p>
<p><inputtype="checkbox" value="138"/><span>青年</span></p>
<p><inputtype="checkbox" value="139"/><span>兒童</span></p>
</div>
該復選框族是選出適宜人群,在js中對其操作如下:
var crowd=[],//聲明存取復選框值的數組
$("#crowd input:checkbox:checked").each(function(){
crowd.push(this.value);
});//遍歷復選框,將選中的值存入crowd 數組
$("#crowdinput:hidden").val(crowd.join(","));//從crowd數組中取出值,並且將這些值串成一個字符串,值與值之間用逗號分隔。
例如選中老人和兒童,則參數格式如下:...?crowd=137,139
3.select
jquery中select的操作相對簡單,但是,可以通過append()函數動態的添加option項即可。
例如頁面中有一個select控件如下:
<select id="crowd" name="crowd">
<optionvalue="-1">請選擇</option>
</select>
js代碼如下所示:
var crowd="老人 137,青年 138,兒童 139"; //選項字符串數組
crowd=crowd.split(",");//字符串分割
vartemp=$("#crowd");//獲取頁面中的對象
$each(crowd,function(){ //遍歷選項串
var value=this.split(" "); //將選項串繼續分隔
temp.append($("<option/>").html(value[0]).attr("value",value[1]));//添加option
});
至此,select選項的初始化已經完成,由於該控件大多數情況下是使用的單值,所以表單值的獲取不需要再寫
此外select最重要的一個事件就要數onChange了,只需要在頁面上加上onchange事件聲明,然后再在jQuery中處理即可。
4.字符串函數
字符串的包裝是許多語言中很重要的應用,因為非常實用,使用概率也很高,js也不例外,對字符串進行了一系列的封裝,具體方法如下:
引用網址:http://www.w3school.com.cn/js/jsref_obj_string.asp
5.至於其他控件的使用在此先不贅述,后邊用到在寫,表單元素添加完成之后就是表單的提交了,以前也許是使用html的頁面通用對象,比如request等設置參數,或者直接跟在地址后邊,不論怎么處理,都要寫一大堆的代碼,然而使用jQuery之后,這一工作變的異常的簡單。原因就是serialize()方法的使用。
例子如下:
html:
<form name="form1" id="form1"method="post">
<p><inputtype="checkbox" value="137"/><span>老人</span></p>
<p><inputtype="checkbox" value="138"/><span>青年</span></p>
<p><inputtype="checkbox" value="139"/><span>兒童</span></p>
</div>
該復選框族是選出適宜人群,在js中對其操作如下:
var crowd=[],//聲明存取復選框值的數組
$("#crowd input:checkbox:checked").each(function(){
crowd.push(this.value);
});//遍歷復選框,將選中的值存入crowd 數組
$("#crowdinput:hidden").val(crowd.join(","));//從crowd數組中取出值,並且將這些值串成一個字符串,值與值之間用逗號分隔。
例如選中老人和兒童,則參數格式如下:...?crowd=137,139
3.select
jquery中select的操作相對簡單,但是,可以通過append()函數動態的添加option項即可。
例如頁面中有一個select控件如下:
<select id="crowd" name="crowd">
<optionvalue="-1">請選擇</option>
</select>
js代碼如下所示:
var crowd="老人 137,青年 138,兒童 139"; //選項字符串數組
crowd=crowd.split(",");//字符串分割
vartemp=$("#crowd");//獲取頁面中的對象
$each(crowd,function(){ //遍歷選項串
var value=this.split(" "); //將選項串繼續分隔
temp.append($("<option/>").html(value[0]).attr("value",value[1]));//添加option
});
至此,select選項的初始化已經完成,由於該控件大多數情況下是使用的單值,所以表單值的獲取不需要再寫
此外select最重要的一個事件就要數onChange了,只需要在頁面上加上onchange事件聲明,然后再在jQuery中處理即可。
4.字符串函數
字符串的包裝是許多語言中很重要的應用,因為非常實用,使用概率也很高,js也不例外,對字符串進行了一系列的封裝,具體方法如下:
| 方法 | 描述 | FF | IE |
|---|---|---|---|
| anchor() | 創建 HTML 錨。 | 1 | 3 |
| big() | 用大號字體顯示字符串。 | 1 | 3 |
| blink() | 顯示閃動字符串。 | 1 | |
| bold() | 使用粗體顯示字符串。 | 1 | 3 |
| charAt() | 返回在指定位置的字符。 | 1 | 3 |
| charCodeAt() | 返回在指定的位置的字符的 Unicode 編碼。 | 1 | 4 |
| concat() | 連接字符串。 | 1 | 4 |
| fixed() | 以打字機文本顯示字符串。 | 1 | 3 |
| fontcolor() | 使用指定的顏色來顯示字符串。 | 1 | 3 |
| fontsize() | 使用指定的尺寸來顯示字符串。 | 1 | 3 |
| fromCharCode() | 從字符編碼創建一個字符串。 | 1 | 4 |
| indexOf() | 檢索字符串。 | 1 | 3 |
| italics() | 使用斜體顯示字符串。 | 1 | 3 |
| lastIndexOf() | 從后向前搜索字符串。 | 1 | 3 |
| link() | 將字符串顯示為鏈接。 | 1 | 3 |
| localeCompare() | 用本地特定的順序來比較兩個字符串。 | 1 | 4 |
| match() | 找到一個或多個正在表達式的匹配。 | 1 | 4 |
| replace() | 替換與正則表達式匹配的子串。 | 1 | 4 |
| search() | 檢索與正則表達式相匹配的值。 | 1 | 4 |
| slice() | 提取字符串的片斷,並在新的字符串中返回被提取的部分。 | 1 | 4 |
| small() | 使用小字號來顯示字符串。 | 1 | 3 |
| split() | 把字符串分割為字符串數組。 | 1 | 4 |
| strike() | 使用刪除線來顯示字符串。 | 1 | 3 |
| sub() | 把字符串顯示為下標。 | 1 | 3 |
| substr() | 從起始索引號提取字符串中指定數目的字符。 | 1 | 4 |
| substring() | 提取字符串中兩個指定的索引號之間的字符。 | 1 | 3 |
| sup() | 把字符串顯示為上標。 | 1 | 3 |
| toLocaleLowerCase() | 把字符串轉換為小寫。 | - | - |
| toLocaleUpperCase() | 把字符串轉換為大寫。 | - | - |
| toLowerCase() | 把字符串轉換為小寫。 | 1 | 3 |
| toUpperCase() | 把字符串轉換為大寫。 | 1 | 3 |
| toSource() | 代表對象的源代碼。 | 1 | - |
| toString() | 返回字符串。 | - | - |
| valueOf() | 返回某個字符串對象的原始值。 | 1 | 4 |
5.至於其他控件的使用在此先不贅述,后邊用到在寫,表單元素添加完成之后就是表單的提交了,以前也許是使用html的頁面通用對象,比如request等設置參數,或者直接跟在地址后邊,不論怎么處理,都要寫一大堆的代碼,然而使用jQuery之后,這一工作變的異常的簡單。原因就是serialize()方法的使用。
例子如下:
html:
<form name="form1" id="form1"method="post">
<input type='text' name='name' value='John'/>
<input type='text' name='location' value='Boston'/>
<button name="bt" click="btClick">
</form>
jquery代碼:
<script type="text/javasctipt">
function btClick()
{
window.location.href=url+"?"+$("#form1").serialize();
}
</script>
Result:
url?name=John&location=Boston
// 訂單金額信息
var $orderMoneyInfo = $('#track'+orderId).children('td').eq(3).text();
// 分割金額和支付方式文案
var moneyIndex = $orderMoneyInfo.indexOf(".");
var $moneyInfo = $orderMoneyInfo.substr(0, moneyIndex+3);
var $paymentWayInfo = $orderMoneyInfo.substr(moneyIndex+3, $orderMoneyInfo.length);
var $contend =
"<div id=\"mbz\">" +
" <div class=\"m-text\"><i class=\"bg-joy\"></i>" +
" <p class=\"ftx-04\">replaceValue</p>" +
" </div>" +
"<div class=\"m minfo\">" +
" <div class=\"mt\"><h3>訂單信息</h3></div>" +
"<div class=\"mc\">" +
" <ul class=\"list-oinfo\">" +
" <li>訂單號:"+orderId+"</li>" +
" <li>訂單金額:<strong class=\"ftx-01\">"+$moneyInfo+"</strong> "+$paymentWayInfo+"</li>" +
" </ul>" +
" <h5>訂單商品:</h5>" +
" <div class=\"scrollimg\">" +
" <div id=\"scrollimg\" style=\"position: relative; width: 392px; height: 56px; overflow: hidden;\">" +
" <ul style=\"position: absolute; left: 0px; top: 0px; width: 784px;\">" +
$wareImagList +
" </ul>" +
" </div>" +
" <span id=\"prev\" class=\"disabled\"><</span>" +
" <span id=\"next\" class=\"\">></span>" +
" </div>" +
"</div>" +
"</div>" +
"<div class=\"btns\">" +
"<a class=\"btn btn-6\" href=\"#none\" onclick=\"finishConfirm("+orderId + "," + orderType + "," + venderId + ")\"><s></s>確定</a><a id='cancelBtn"+ orderId +"' class=\"btn btn-10\" href=\"#none\" onclick=\"jdThickBoxclose()\"><s></s>取消</a>"+
"</div>"+
"</div>";
if(orderType >=21 && orderType <=25){
$contend = $contend.replace("replaceValue", "value1");
} else {
$contend = $contend.replace("replaceValue", "value2");
}
