表单提交不适用于相对定位的div
表单提交不适用于相对定位的div
提问于 2014-04-01 16:21:26
当我们单击<form> (框架顶部的黑色背景)时，jQuery/CSS显示的div中有一个HTML。
jQuery工作正常，但是，当您单击<input type="submit">时，什么都不会发生。数据不会发送到php文件进行处理。
我试过用GET和POST的方法，没什么.
我在这里做了一个JSFiddle：
http://jsfiddle.net/jcdarocha/64FW4/
HTML：
<div id="container">
<div id="news" class="hidden">
<article>
<form action="form-news.php" method="post" id="form-news">
<label for="news-name">Name :</label>
<input type="text" id="news-name" name="news-name">
<input type="submit" name="submit-news" value="Ok" id="submit-news">
</form>
<div id="news_added"></div>
</article>
<br class="clear">
</div><br class="clear">
</div>联署材料：
$(document).ready( function() {
$("#container").click(function(){
$("#news").removeClass("hidden");
return false;
});
});CSS：
#container{background:black; position:relative;}
#news{position:absolute; top:100px; left:50px;}
.clear{clear:both;}
.hidden{display:none;}回答 2
Stack Overflow用户
回答已采纳
发布于 2014-04-02 19:04:41
删除return false;中的JavaScript代码，它就能正常工作了。
希望能帮上忙
Stack Overflow用户
发布于 2014-04-01 16:41:58
您的事件正在冒泡，所以单击按钮返回false。若要修复此添加事件，请防止传播。
我还更新了您的代码以使用.on而不是.click。
http://jsfiddle.net/jFIT/64FW4/1/
$(document).ready(function () {
$("body").on('click', '#container', function (e) {
console.log("hit"); //check the log you will see that even the input will trigger this console.log.
e.preventPropagation; //this stops bubbling.
if (!$(e.target).is(':input')) { //maybe you want to check if the DIV is the only thing clicked? here is where to do this.
$("#news").removeClass("hidden");
return false;
}
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/22791442
复制相关文章
相似问题
腾讯云开发者
