我有一张这样的 table
<tr>
<td>No.</td>
<td>Username</td>
<td>Password</td>
<td>Valid Until</td>
<td>Delete</td>
<td>Edit</td>
</tr>
<tr>
<td>1</td>
<td id="1">
<div class="1u" style="display: none;">Username</div>
<input type="text" class="inputTxt" value="Username" style="display: block;"/>
</td>
<td id="1">
<div class="1p" style="display: none;">Password</div>
<input type="text" class="inputTxt" value="Password" style="display: block;"/></td>
<td>18 Jul 09</td>
<td><button value="1" class="deleteThis">x</button></td>
<td class="editRow">Edit</td>
</tr>
单击编辑后,我运行此函数
$('.editRow').click(function() {
var row = $(this).parent('tr');
row.find('.1u').slideUp('fast');
row.find('.1p').slideUp('fast');
row.find('.inputTxt').slideDown('fast');
});
这会用输入字段替换文本,所以我想要的是在单击其他地方而不是保存时将其取消回文本。
我该如何做到这一点以及改进我的功能的任何建议$('.editRow').click
/////////////已编辑/////////
$('.editRow').click(function() {
var row = $(this).parent('tr');
row.find('.1u').slideUp('fast');
row.find('.1p').slideUp('fast');
row.find('.inputTxt').slideDown('fast');
}).blur(function() {
row.find('.inputTxt').slideUp('fast');
row.find('.1u').slideDown('fast');
row.find('.1p').slideDown('fast');
});
我正在使用它,但输入字段没有变回文本。
谢谢。
最佳答案
您可以像处理点击一样处理模糊事件。
$('.editRow').click(function() {
var row = $(this).parent('tr');
row.find('.1u').slideUp('fast');
row.find('.1p').slideUp('fast');
row.find('.inputTxt').slideDown('fast');
}).blur(function(){ do something else});
希望这有帮助
更新
$('.editRow').click(function() {
var row = $(this).parent('tr');
row.find('.1u').slideUp('fast');
row.find('.1p').slideUp('fast');
row.find('.inputTxt').slideDown('fast').blur(function(){
//change the .inputTxt control to a span
});
})
关于javascript - 如果单击其他地方,如何将元素样式恢复正常?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1154524/