jQuery在click事件中排除子元素
jQuery exclude child element in click event
这是我的HTML:
<td>
<a href="alias.php?Id=97113&redir=index" class="" atip="">aaaa</a> <b>(97113)</b>
</td>
这是我的JS:
var row_Value = '';
var row_ValueTmp = '';
var aHref = '';
var aClass = '';
var aTip = '';
var manufactererIdAndAliasHtml = '';
$("#batchform tbody tr td:nth-child(3)").dblclick(function(e){
e.preventDefault();
aHref = $(this).find('a').attr('href');
aClass = $(this).find('a').attr('class') || '';
aTip = $(this).find('a').attr('atip') || '';
row_Value = $(this).find('a').text().replace(/"/g, """);
row_ValueTmp = '<div><input type="text" name="tempName" id="tempName" value="'
+ row_Value + '" style="width:90%">'
+ '</div><div id="row_msg"></div>';
$(this).find('a').remove();
manufactererIdAndAliasHtml = $(this).html();
$(this).prepend(row_ValueTmp);
$("#tempName").focus().blur(function(){
var manuId = $(this).parent().parent().find('b').text();
manuId = parseInt( manuId.replace('(','').replace(')','').trim() );
// console.log( manuId );
var msgLayer = document.getElementById("row_msg");
msgLayer.innerHTML = '<font color= "green"><?=$this->GetTranslation("Please wait...");?></font>';
$.ajax({
type: "POST",
url: "ajaxupdate.php",
data:{ tempName: $(this).val(), id: manuId },
dataType: "json",
success: function(re)
{
if(re.message != 'Success'){
msgLayer.innerHTML = '<font color="red">' + re.message + '</font>';
}
$("#tempName").parent().parent().html(
'<a atip="' + aTip + '" class="' + aClass + '" href="' + aHref + '">'
+ $("#tempName").val() + '</a>'
+ manufactererIdAndAliasHtml);
return false;
}
});
});
});
$("#batchform tbody tr td:nth-child(3)").click(function(e){
row_Value = $("#tempName").val();
$("#tempName").parent().parent().html( '<a atip="' + aTip + '" class="' + aClass + '" href="' + aHref + '">' + row_Value + '</a>'
+ manufactererIdAndAliasHtml);
});
现在它有一个问题,当我在input
元素中单击鼠标时,click
事件将被触发,我希望它不被触发。因为我不希望在单击input
时更改编辑状态。
以下是我尝试过但没有成功的东西:
$("#batchform tbody tr td:nth-child(3):not(:has(input))").click(function(){
console.log('still fired');
});
$("#batchform tbody tr td:nth-child(3)").live('filter', function() {
return $(this).children('input').length == 0;
}).click(function(){
console.log('still fired');
});
e.stopPropagation();
可以帮你搞定。。
可以插入e.preventDefault();
之后
这将防止事件在DOM树中冒泡。
其他信息可以在Jquery API 中找到
您可能需要:
e.stopImmediatePropagation();
它应该可以阻止点击触发td元素。
描述:阻止其余处理程序执行,并防止事件在DOM树中冒泡。
$("#batchform tbody tr td:nth-child(3)").off("click").on("click",function(e){
row_Value = $("#tempName").val();
$("#tempName").parent().parent().html( '<a atip="' + aTip + '" class="' + aClass + '" href="' + aHref + '">' + row_Value + '</a>' + manufactererIdAndAliasHtml);
});
试试这个代码片段。
相关文章:
- 使用 jQuery 创建可单击的行并排除子元素
- getElementsByTagName排除元素(筛选器)
- 如何将元素添加到动态数组并排除现有元素
- jQuery按数据值排除元素
- 排除基于先前ElementSibling的元素
- 获取元素的内部文本,但排除隐藏的子元素
- 我可以在 ReactJS 中排除原始元素的子元素吗?
- 如何在绑定事件期间排除元素
- 如何在文档单击时排除元素
- 从 hide() 操作中排除父元素及其子元素
- TinyMCE - 排除元素
- 从预加载中排除元素
- 如何在jquery.click()事件中排除元素类作为目标
- 如何从ng单击操作中排除元素
- Jquery从HTML方法中排除元素
- 从jQuery选择中排除元素
- 排除元素被cufon替换
- 从对象循环中排除元素
- Jquery:排除元素
- 从单击事件处理程序 (jquery) 中排除元素