jquery divレベルセレクタ
11159 ワード
div id="modelName" class="modelName">
<!-- -->
<div name="CX">
------ :<input name="txtcx" type="text" />
<a href="#" name="addCX"> </a>
<div class="modelPL" id="modelPL">
<!-- -->
<div name="PL">
-------- :<input name="txtpl" type="text" />
<a href="#" name="addPL"> </a>
<div id="modelDate" class="modelDate">
<!-- -->
<div name="SCNF">
------ :<input name="txtscnf" type="text" />
<a href="#" name="addNF"> </a><br/><br/>
</div>
</div>
</div>
<br /><br />
</div>
</div>
<br /><br />
</div>
値の取り方
//
$("#submit").click(function() {
var CX = $("div[name=CX]");
//alert(" :"+CX.size());
var str = "";
var s1 = "";
var s2 = "";
var s3 = ""
CX.each(function(){
/** */
var T1 = $(this).find("input[name=txtcx]");
T1.each(function(){
alert(" : " + $(this).val());
//str += $(this).val() + "@";
s1 += $(this).val() + "@";
});
// DIV
var PL = $(this).find("#modelPL div[name=PL]");
//alert(" :" + PL.size());
//alert("html:" + PL.html());
PL.each(function(){
/** */
var T2 = $(this).find("input[name=txtpl]");
T2.each(function(){
//alert("!! : " + $(this).val());
//str += $(this).val() + "#";
s2 += $(this).val() + "#";
});
// DIV
var NF = $(this).find("#modelDate div[name=SCNF] input[name=txtscnf]");
//alert(" :" + NF.size());
//alert("html33:" + $(this).find("#modelDate div[name=SCNF]").html());
NF.each(function(){
alert("$$ : " + $(this).val());
s3 += $(this).val() + "$";
});
s2 += s3 + "#";
s3 = "";
});
s1 += s2 + "@";
s2 = "";
});
alert("str:" + s1);
});
});
重要な思想:階層はdivを遍歴して、divを位置決めしながら、input値を取って、2歩に分けて歩いて、肝心なのはセレクタの応用です.現在の遍歴オブジェクトthisでは、セレクタを再運用することが肝心である.find()メソッド