JQuery在表中添加行,行未定义[重复]。


我对HTMLJQuery比较陌生。我目前正试图用一个onclick函数将一行从一个表中添加到另一个表中。这里是包含我想添加的行的表,如果点击。

<table class="tables" id="playerSearchTable" >
    <% for (var i = 0; i < res1.length; i++) { %>
        <form>
            <tr class="player_search_tr">
                <td class="playerTeamTableName1<%=i%>" id="player_name_submit" width="250px"><%= res1[i].Name %></td>
                <input type="hidden" id="player_name<%=i%>" value="<%= res1[i].Name %>" />
                <input type="hidden" id="player_pos<%=i%>" value="<%= res1[i].position_summary %>" />
                <td  width="90px" style="padding-left: 25px;" ><%= res1[i].position_summary %></td>
                <td  class="playerTeamTableName" width="90px" style="padding-left: 25px;"><%= res1[i].team_abbrv %></td>
                <td  width="120px" style="padding-left: 25px;"><%= res1[i].league_abbrv %></td>
           </tr>
       </form>
   <% } %>
</table>

这里是我的函数。

$(document).ready(function(){
    ul = document.getElementById("playerSearchTable");
    li = ul.getElementsByTagName('tr');
    for (i = 0; i < li.length; i++) {
        player_name = li[i].getElementsByClassName("playerTeamTableName1"+i);
        $(player_name).click(function(){
            var name = $("#player_name" + i).val();
            var pos = $("#player_pos" + i).val();
            player_table_list = document.getElementById("playerSearchTable1");
            var markup = "<tr class=\"player_search_tr\"><td width=\"60px\"></td><td width=\"300px\">" + name + "</td><td width=\"90px\">" + pos + "</td></tr>";
            $('#playerSearchTable1').append(markup);
         });
     }
});

然而,当我运行上面的代码时 被插入的行在每个单元格中都含有 “undefined “的值。我在这里遗漏了什么?

解决方案:

你的jquery中的 “i “在点击函数中是无法访问的。

你可以在html中使用一个属性来设置这个。

我为你做了一个JSFiddle。https:/jsfiddle.netsngkxvre3

<table class="tables" id="playerSearchTable" >
        <form>
            <tr class="player_search_tr">
                <td class="playerTeamTableName10" key="0" id="player_name_submit" width="250px">td0</td>
                <input type="hidden" id="player_name0" value="name0" />
                <input type="hidden" id="player_pos0" value="pos0" />
                <td  width="90px" style="padding-left: 25px;" >pos0</td>
                <td  class="playerTeamTableName" width="90px" style="padding-left: 25px;">team0</td>
                <td  width="120px" style="padding-left: 25px;">league0</td>
           </tr>
       </form>
       <form>
            <tr class="player_search_tr">
                <td class="playerTeamTableName11" key="1" id="player_name_submit" width="250px">td1</td>
                <input type="hidden" id="player_name1" value="name1" />
                <input type="hidden" id="player_pos1" value="pos1" />
                <td  width="90px" style="padding-left: 25px;" >pos1</td>
                <td  class="playerTeamTableName" width="90px" style="padding-left: 25px;">team1</td>
                <td  width="120px" style="padding-left: 25px;">league1</td>
           </tr>
       </form>
</table>
<table id="playerSearchTable1" style="background-color:blue;">

</table>








$(document).ready(function(){
    ul = document.getElementById("playerSearchTable");
    li = ul.getElementsByTagName('tr');
    for (i = 0; i < li.length; i++) {
        player_name = li[i].getElementsByClassName("playerTeamTableName1"+i);
        $(player_name).click(function(){
            let j = $(this).attr('key');
            var name = $("input[id='player_name"+j+"']").val();
            var pos = $("input[id='player_pos"+j+"']").val();
            player_table_list = document.getElementById("playerSearchTable1");
            var markup = "<tr class=\"player_search_tr\"><td width=\"60px\"></td><td width=\"300px\">" + name + "</td><td width=\"90px\">" + pos + "</td></tr>";
            $('#playerSearchTable1').append(markup);
         });
     }
});

给TA打赏
共{{data.count}}人
人已打赏
未分类

HSQLDB中的递归存储过程

2022-9-9 11:11:37

未分类

(React-Native 0.62.0) 无法找到项目:react-native-community_async-storage的匹配变体(其他库也一样)

2022-9-9 11:11:39

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索