个人中心
gpt4 book ai didi

javascript - 单击显示按钮时显示表中找到的所有名称

转载 作者：行者123 更新时间：2023-11-27 22:44:16 25 4
gpt4 key购买 nike

我需要显示表#tb中找到的所有名称，并在用户单击display按钮时使用jQuery显示为列表。

我的代码如下。我可以成功添加，但如何从列名中获取数据并显示为列表？

@{
    Layout = null;
}

<!DOCTYPE html>    
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <script src="~/Scripts/jquery-1.10.2.js"></script>
    <script>          
        $(function () {
            $("#btn").click(function() {
                var x = $("#txt1").val();
                var y = $("#txt2").val();
                var z = $("#mycountry").val();
                $("#tb").append("<tr> <td>" + x + "</td> <td>" + y + "</td> <td>" + z + "</td><td> <input type='button'class='c' value='Delete'/></td><td> <input type='button' class='d' value='Edit'/></td></tr>");
            });

            $("#tb").on("click", ".c", function () {
                //$(this).parent().parent().remove();
                $(this).closest('tr').remove();
            });

            $("#tb").on("click", ".d", function () {
               var row = $(this).closest('tr').toggleClass("editing");
               row.find("td").slice(0, 3).prop("contenteditable", row.hasClass("editing"));
           });
        });
    </script>
    <style>
        .editing {
            background: yellow;
        }
    </style>
</head>
<body>
    <div>
        ID 
        <input type="text" id="txt1" /><br />

        Name 
        <input type="text" id="txt2" /><br />

        Country: 
        <select id="mycountry">
            <option>---select---</option>
            <option>Egypt</option>
            <option>qatar</option>
            <option>saudia</option>
            <option>emarates</option>
        </select><br />
        <input type="button" value="add" id="btn" />
        <input type="button" value="display" id="btndis" />

        <table>
            <thead>
                <tr>
                    <td>
                        ID
                    </td>
                    <td>
                        Name
                    </td>
                    <td>
                        Country
                    </td>
                    <td>
                </tr>
            </thead>
            <tbody id="tb"></tbody>
        </table>
    </div>
</body>
</html>

最佳答案

试试这个:

https://jsfiddle.net/ionutmihai1995/euk6xkzp/ 

$('#btndis').click(function(){
        $('ul').empty();
            $("#tb").find('tr').each(function(i,el){
                var $tds = $(this).find('td');
              //for name
                $('ul').append("<li>"+$tds.eq(1).text()+"</li>");
            }); 
});

关于javascript - 单击显示按钮时显示表中找到的所有名称，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38521373/

25 4 0
文章推荐： javascript - Javascript 中的 C3 图表 json 数据格式
文章推荐： html - 希望开发适用于 HTML5 的聊天服务器？技术可用？
文章推荐： html - Facebook 代码设计是如何实现的？
文章推荐： css - html和*在为整个页面设置颜色或字体时的区别
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com