Javascript 按钮内的文本框-引导twitter

我想在按钮内设置一个文本框。我在文本框的click事件中遇到问题-每当我单击文本框时，它也会单击按钮并触发按钮的事件。 我想将这两个事件分开，这样当我单击文本框进行键入时，它不会触发连接到单击按钮的事件。我怎样才能做到这一点

---

编辑：我已尝试使用StopRopagation和PreventedAflt，但按钮事件在到达我的事件之前触发。

对于您的要求，此代码将起作用

$('#btn').click(function(){
this.preventDefault();
    alert("wont fire");
});

$('#txt').on('click',function(){
    alert("text is clicked");
});

---

看看这个和事件之间的区别

也许HTML布局有问题，下面是一些工作正常的东西，为每个元素提供一个z索引：

HTML:

---

这里有一个输入错误的问题？我看不出这个例子。无论如何，试试这个：我编辑了我的问题。也许你没有达到stopPropagation函数…你把它保存在你的代码中…你能给我们看看javascript（JSFIDLE）吗？你的确切要求是什么？如果不希望在文本框上调用按钮单击，请单击。。什么时候可以？如果可能的话，在提琴上给出将文本框保留在buton中的具体原因？还是仅仅是UI需求？

<div  style="z-index: 2; position:absolute; top:0"> 
   <input id="text" type="text"/>
</div>
<div style="z-index: 1; position:absolute; top:0 ">
   <input id="button" style="width:200px; height:40px; text-align:right" type="Button" value="button"/>
</div>

$("#text").click(function(){
    alert("text clicked");
});
$("#button").click(function(){
    alert("button clicked");
});