jQuery中$.each()和json实例

梦里梦外; 2022-06-15 00:46 145阅读 0赞

![效果图][SouthEast]

<!DOCTYPE html>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title>挑战题</title>
            <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
        </head>
        <body>
            <div>
                <span>姓名：</span>
                <span><input id="text" type="text" name="UserName" placeholder="请输入姓名"></span></br>
                <span>性别：</span>
                <span><select id="sex">
                    <option>男</option>
                    <option>女</option>
                </select></span></br>
                <input id="btn" type="button" value="提交">
            </div>
           <ul id="list">
    
           </ul> 
           <script> $('#btn').on("click",function(){ //方法1，直接获取，记得写在函数里面，当改变时动态获取 var json=[{ "name": $("#text").val(), "sex": $("#sex").val() }] //方法2动态添加 var json=[]; json.push({"name": $("#text").val(),"sex":$("#sex").val()}); $.each(json,function(index){ $('#list').append("<li>姓名为："+json[index].name+"</br>性别："+json[index].sex+"</li>"); }) }) </script>
        </body>
    </html>

[SouthEast]: /images/20220615/447651cc085d4573942376fee6ecd3b7.png

发表评论取消回复

表情：

评论列表（有 0 条评论，145人围观）

还没有评论，来说两句吧...

相关阅读

相关 jQuery中的each方法实例

$.each()和$(selector).each()很相似，但是是不一样的。前者可用于遍历一个数组或是json对象而后者是专门用来遍历一个jQuery对象先来说说

小咪咪/ 2022年08月13日 11:49/ 0 赞/ 173 阅读

相关 jQuery 中的 each()

通过它，你可以遍历对象、数组的属性值并进行处理。使用说明 each函数根据参数的类型实现的效果不完全一致： 1、遍历对象(有附加参数) $.each(Object,

旧城等待，/ 2022年08月05日 12:25/ 0 赞/ 179 阅读

相关 jQuery中$.each()和json实例

![效果图][SouthEast] <!DOCTYPE html> <html> <head> <meta http-

梦里梦外;/ 2022年06月15日 00:46/ 0 赞/ 146 阅读

相关 $.each(json,function(index,item){ }); jquery遍历

$.each(json,function(index,item) 里面的index代表当前循环到第几个索引， item表示

深碍√TFBOYSˉ_/ 2022年05月27日 23:48/ 0 赞/ 203 阅读

相关 jQuery.each

each()方法能使DOM循环结构简洁，不容易出错。each()函数封装了十分强大的遍历功能，使用也很方便，它可以遍历一维数组、多维数组、DOM, JSON 等等在jav

不念不忘少年蓝@/ 2021年12月03日 06:23/ 0 赞/ 298 阅读

相关 jquery的$().each,$.each的区别

在jquery中，遍历对象和数组，经常会用到$().each和$.each()，两个方法。两个方法是有区别的，从而这两个方法在针对不同的操作上，显示了各自的特点。 $().e

灰太狼/ 2021年11月14日 14:08/ 0 赞/ 399 阅读

相关 jquery的$().each,$.each的区别

最近一直在研究JS，今天看到遍历模块的时候，看到了这个函数： $(selector).each(function(index,element)) 但是想想，这个函数和之前项

以你之姓@/ 2021年09月14日 09:46/ 0 赞/ 402 阅读

相关 JQuery中的each()方法和$.each()函数的使用

1、each()方法的使用 JQuery提供了 each() 方法用于遍历匹配的元素信息。以每一个匹配的元素作为上下文来执行一个函数。每次执行传递进来的函数时，函数中的

Myth丶恋晨/ 2021年08月31日 14:29/ 0 赞/ 429 阅读

相关 jQuery each中的break

jquery的each方法时，在callback函数中使用了break，想跳出循环，谁知没用。最后查了下使用文档，原来要在callback函数中返回false就可以调出循环了，

Love The Way You Lie/ 2021年06月24日 14:00/ 0 赞/ 525 阅读

相关 jQuery中each之break和continue

但是我在今天写javascript的时候，在一个function里有一个each,在each里某种条件成立的话，就把这个function返回true或者false

雨点打透心脏的1/2处/ 2021年06月24日 13:59/ 0 赞/ 430 阅读