『壹』 jquery中each 跳出為什麼用return false
由於jQuery的each是通過循環調用回調函數的方式實現的,所以在函數內寫的break只適用於函數內部的邏輯,並不能對函數外層的循環起到作用,所以break不管用。具體可以分析一下jQuery的源碼,下面以jQuery2.1.4中的each方法舉例:
each:function(obj,callback,args){
varvalue,
i=0,
length=obj.length,
isArray=isArraylike(obj);//如果obj是一個類似數組的結構(可用for遍歷的),則為true
if(args){
if(isArray){
for(;i<length;i++){
value=callback.apply(obj[i],args);//循環調用
if(value===false){//如果返回值全等於(包括類型和值)false,就退出循環
break;
}
}
}else{
for(iinobj){//這種是對象的,需要用forin遍歷
value=callback.apply(obj[i],args);
if(value===false){
break;
}
}
}
//Aspecial,fast,caseforthemostcommonuseofeach
}else{
if(isArray){
for(;i<length;i++){
value=callback.call(obj[i],i,obj[i]);
if(value===false){
break;
}
}
}else{
for(iinobj){
value=callback.call(obj[i],i,obj[i]);
if(value===false){
break;
}
}
}
}
returnobj;
}
由源碼可以看出,只有回調函數返回的值為false時,才會退出循環
『貳』 急!簡單Javascript/js/jquery代碼實現,源碼如下
<!DOCTYPE html>
<html>
<head>
<script src="jquery-1.9.1.js">
</script>
<script>
$(document).ready(function(){
$("#zh").click(function(){
var ys1=$('#ys1').val();
var ys2=$('#ys2').val();
var htmlstr='';
$("input[name='cb']:checked").each(function(){
if(ys1!=""){
htmlstr+='<input type="text" value="顏色1:'+ys1+'-'+$(this).val()+'"><br/>';
}
if(ys2!=""){
htmlstr+='<input type="text" value="顏色2:'+ys2+'-'+$(this).val()+'"><br/>';
}
})
$("#cc").html(htmlstr);
});
});
</script>
</head>
<body>
顏色1<select name="st[]" id="ys1"> <option> <option value="1">y1 <option value="2">y2 <option value="3">y3</select><br>顏色2<select name="st[]" id="ys2"> <option> <option value="1">y1 <option value="2">y2 <option value="3">y3</select><br>尺碼: <br><input type="checkbox" name="cb" value="a">X1<input type="checkbox" name="cb" value="b">X2<input type="checkbox" name="cb" value="c">X3<input type="button" value="組合" onclick="" id="zh"><br><br>需求:如果顏色1選擇為1<br>如果顏色2選擇為2<br>尺碼選擇a和b<br>點擊【組合】按鈕後——創建4個input如下:value值分別為1-a、1-b、2-a、2-b
<div id="cc">
</div>
</body>
</html>