jQ选择器 jQ("#objcect").find("label > input[name]")是什么意思

jQ选择器 jQ("#objcect").find("label > input[name]")是什么意思,第1张

jQ("#objcect")find("label > input[name]") 是在id为objcect的元素中查找所有label元素的所有带name属性的input元素,且input元素必须是label元素的直接子元素(换句话说只能是子元素,不能是孙子元素或其他后代元素)。比如下面的

<div id="objcect">

<label>

<input name="a" value="这个元素会被选中" />

<span><input name="b" value="这个元素不会被选中" /></span>

</label>

</div>

用jq获取一个div内部所有input[type='text']的值,代码如下:

<div id="divid">

<div><input type="hidden" value="456"></div>

</div>

<script type="text/javascript">

$("#divid input[type=hidden]")each(function () {

consolelog(thisvalue);

})

</script>

扩展资料

var  allChildDiv=$('#addDiv')find("div")//找到addDiv下面的所有div

for(var a=0;a<allChildDivlength;a++){

allChildDiveq(a)find('input[name="username"]')//用户名

allChildDiveq(a)find('input[name="pwd"]')//密码

};

参考资料:

百度百科 DIV (层叠样式表单元的位置和层次)

百度百科 input (函数)

jQuery 选择器中 :last 表示最后一个元素,所以表示含有某类属性的最后一个元素可用如下代码表示

$("test-class:last")  // 表示最后一个属于test-class类的元素

示例如下:

创建Html元素

<div class="top">

<ul>

<li>list-1</li>

<li class="selected">list-2</li>

<li class="selected">list-3</li>

<li>list-4</li>

<li class="selected">list-5</li>

</ul>

<span>红色列表项表示属于selected类,d出框显示了最后一个属于selected类的元素的内容</span>

</div>

设置css样式

divtop{margin:50px;padding:10px;width:300px;height:250px;border:2px dashed #ebbcbe;}

li{padding:5px;}

liselected{color:red;font-weight:bold;}

span{color:#999;}

编写jquery代码

$(function(){

$("ul")click(function() {

alert($("liselected:last")text());

});

})

观察显示效果

jquery选择器(即针对你指定的那个input元素)和获取内容(即获得输入的值),所以综合起来有如下代码可以实现

$("input#test")val;         // 推荐这种方式,因为id是唯一的

$("input[name='test']")val; // 此时需要注意是否有同名的input元素

$("input:text")val;         // 这种方式只有整个网页只有一个文本输入框才是正确的

下面给出示例:

1创建一个文本框和一个触发获取文本框输入内容的按钮

<input id="test" name="test" type="text"/><br>

<input type="button" value="显示文本框输入内容">

2简单设置一下css样式

input[type='text']{width:200px;height:35px;margin:10px;border:1px dashed green; border-radius:5px;}

input[type='button']{width:200px;height:35px;margin:10px;border:2px solid #ebbcbe;}

3添加jquery代码

$(function{

$("input:button")click(function {

alert($("input#test")val);

});

})

观察显示效果

以上就是关于jQ选择器 jQ("#objcect").find("label > input[name]")是什么意思全部的内容,包括:jQ选择器 jQ("#objcect").find("label > input[name]")是什么意思、如何用jq获取一个div内部所有input[type='text']的值、jq获取最后一个元素等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9276203.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-26
下一篇 2023-04-26

发表评论

登录后才能评论

评论列表(0条)

保存