ASPX中有一个表格:
HTML code
<table border="1"> <tr> <th scope="col">类别编号 </th> <th scope="col">类别名称 </th> </tr> <tr> <td>1 </td> <td class="edittable">新闻 </td> </tr> </table>
现在在后台加上jquery的JS代码和一个自编的JS文件,内容如果
JScript code
$(function () { $(".edittable").click(function () { var obj = $(this); var oldtext = $.trim(obj.text()); //取出表格中原来的文字 var inputbox = $(" <input type='text'value=''>"); //构造一个文本框 obj.html(inputbox); //设置表格中是文本框 inputbox.text(oldtext); //设置文本框中的内容 alert(oldtext); } ); } );
结果没有达到效果,点击表格以后只是变成了文本框,但是文本框中没有内容,是什么原因?最后的两句的JS代码好像没有执行,难道语法错误!?
楼主出错的地方在
[code="javascript"]inputbox.text(oldtext)[/code]
它是一个input ,input对应的是value ,所以使用val()函数
我测试过了,全部代码如下:
[code="html"]
类别编号 | 类别名称 |
---|---|
1 | 新闻 |
[/code]
inputbox.text(oldtext); 不是这么写啦
应该为
inputbox.attr("text",oldtext);
:idea:
原因是因为这句
obj.html(inputbox)
这里执行的操作是将inputbox对应的dom复制到obj的内部,而不是将inputbox的jquery对象放到obj中,因此下一句的操作inputbox.text(oldtext)的操作对象不是文本框。
先找到这个,再重新设置文本框内容。
$("input").text(oldtext);