首页新闻找找看学习计划

js执行不了想执行的结果 请大佬帮忙看看到底哪里出问题了 感谢

0
悬赏园豆:5 [已解决问题] 解决于 2019-10-15 09:15

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript"
src="../js/jquery-1.4.2.js"></script>
<script type="text/javascript">
$(function(){

    //给按钮绑定事件
    $("input:last").click(function(){
        //创建td并设置文本内容
         var nametd = $("<td></td>");
         var agetd = $("<td></td>");
         var saltd = $("<td></td>");
         var deltd = $("<td></td>");

         nametd.text($("input:eq(0)").val());
         agetd.text($("input:eq(1)").val());
         saltd.text($("input:eq(2)").val());
         //创建tr并且把td装进去
         var tr = $("<tr></tr>");
         tr.append(nametd);
         tr.append(agetd);
         tr.append(saltd);
         //把tr装进table
         $("table").append(tr);
    })
})

</script>
</head>
<body>
<input type="text" placeholder="员工姓名">
<input type="text" placeholder="员工年龄">
<input type="text" placeholder="员工工资">
<input type="button" value="添加">
<hr>
<table>
<caption>员工表</caption>
<tr>
<th>姓名</th><th>年龄</th><th>工资</th><th>操作</th>
</tr>
</table>
</body>
</html>

上图这段代码可以正常执行,但是下面这段代码和上面一样却不能执行

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript"
src="../js/jquery-1.4.2.js"></script>
<script type="text/javascript">
$(function(){
//给按钮绑定事件
$("input:last").click(function(){
//创建td并设置文本内容
var nametd=$("<td></td>");
var agetd=$("<td></td>");
var saltd=$("<td></td>");
var deltd=$("<td></td>");
nametd.text($("input:eq(0)").val());
agetd.text($("input:eq(1)").val());
saltd.text($("input:eq(2)").val);
//创建tr并且把td装进去
var tr=$("<tr></tr>");
tr.append(nametd);
tr.append(agetd);
tr.append(saltd);
//把tr装进table
$("table").append(tr);

}) 

})
</script>
</head>
<body>
<input type="text" placeholder="员工姓名">
<input type="text" placeholder="员工年龄">
<input type="text" placeholder="员工工资">
<input type="button" value="添加">
<hr>
<table>
<caption>员工表</caption>
<tr>
<th>姓名</th><th>年龄</th><th>工资</th><th>操作</th>
</tr>
</table>
</body>
</html>

这段代码 和上面代码一样 不知为何执行不了想要的结果,点击添加没有任何反应, 请大佬帮忙看下 这段代码,哪里出问题了 感谢。

懒散の小青年的主页 懒散の小青年 | 初学一级 | 园豆:196
提问于:2019-10-14 20:07
< >
分享
最佳答案
0

碰到问题别着急。自己根据F12审查元素调试下。代码一样是不可能出现两种结果的,除非是不一样。
使用个在线文本对比,就看到了:

收获园豆:5
Ctrl` | 小虾三级 |园豆:1942 | 2019-10-15 08:55

多谢 多谢 方便告诉我你用的在线文本比对的网址是啥吗 感谢 感谢 我昨天把眼睛都看酸了,都没看出问题。

懒散の小青年 | 园豆:196 (初学一级) | 2019-10-15 09:11

@懒散の小青年: 我使用的:http://www.jq22.com/textDifference
或者也有其他在线对比的都可以用

Ctrl` | 园豆:1942 (小虾三级) | 2019-10-15 09:13

@Ctrl`: 嗯嗯 感谢

懒散の小青年 | 园豆:196 (初学一级) | 2019-10-15 09:14
其他回答(2)
0

你这代码贴出来很不美观,看得我眼睛疼,是不是input:last这个选择器的问题,这个选择器的作用是选择最后一个last,如果你在它后边还有last就不会选中,你试着给加个id、或者class用类选择器试试

轻红 | 园豆:208 (菜鸟二级) | 2019-10-15 08:49
0

F12 看看报错

Cgrain | 园豆:268 (菜鸟二级) | 2019-10-15 08:49
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册