Javascript事件操纵

Question

我准备使用jquery创建一个inplace编辑器。它的工作原理是单击要编辑的文本，然后用输入替换它的内容。在当前情况下使用选择标记。

除<a>标记外，它的工作正常...如果您点击<a>标记，则会确认您要执行的操作。您可以接受编辑模式或取消它。

如果您接受编辑模式，则会使用<a>更改<select>的内容。问题出现在这一点之后：如果单击选择父标记（<a>），则会激活新的页面加载。

我尝试使用false返回绑定<a>上的click事件，但在这种情况下，select不会通过鼠标工作。

解决这个问题的另一种方法我认为是将click事件绑定到<select>并以某种方式操纵事件对象......

怎么做？或者这是一种错误的方法吗？

更新： 基本方法无效（select内部a）但我找到了一个解决方案：删除href参数，您不需要丑陋的事件黑客甚至在FF中无效。 （类似的问题及其解释：Select tag inside hyperlink problem）

Answer 1

不要更改内容，更改元素。将a元素存储在某处，将其替换为select，然后在完成后再替换。通过这种方式，您无需担心链接触发。

Answer 2

function ask ( e )
{
   e.preventDefault (); //prevents default browser action
   //do whatever
}

element.addEventListener ("click", ask);

Answer 3

为什么要操纵事件对象？你不能只留下一个事件来返回false并将另一个事件处理程序设置为select-tag吗？

Answer 4

这是一个整洁的demonstration

（来自示例：）

$('a').click(function(event) {
     event.preventDefault();   
    $('#edit').show(500);
});

Answer 5

将<select>标记包装在<a>标记中无效HTML。此外，劫持<a>的click事件处理程序以激活select的一个被认为是一个丑陋的黑客。我建议您将<select>放在DOM中的<a>之后，并在编辑期间暂时隐藏链接。

我要尝试的一件事是使用jQuery的DOM操作方法。例如： $('#my_select').detach().insertAfter('#my_link');

Answer 6

基本方法无效（select内部a）但我找到了一个解决方案：删除href参数，你不需要丑陋的事件黑客甚至无法工作在FF。 （类似的问题及其解释：Select tag inside hyperlink problem）