jQuery show（）在Google Chrome中不起作用

我的jQuery代码无法按预期工作。jQuery show（）在Google Chrome中不起作用

下面是HTML：

<a href="">Some link</a> 
<br/> 
<a class="delete_file_initial" href="">Delete file</a> 
<span class="delete_file_question hide">are you sure to delete?</span> 
<a class="delete_file_question confirm hide" href="http://example.com/delete">yes</a> 
<a class="delete_file_question cancel hide" href="">no</a> 
<br/> 
<a class="move_file_initial" href="">Move file</a> 
<span class="move_file_question hide">are you sure to move?</span> 
<a class="move_file_question confirm hide" href="http://example.com/move">yes</a> 
<a class="move_file_question cancel hide" href="">no</a>

和JavaScript：

$(function() { 
    // delete file 
    $("a.delete_file_initial").click(function(event) { 
     event.preventDefault() 
     $(this).hide() 
     $(".delete_file_question").show() 
    }); 
    $("a.delete_file_question").click(function(event) { 
     if ($(this).hasClass("cancel")) { 
      event.preventDefault() 
      $(".delete_file_question").hide() 
      $(".delete_file_initial").show() 
     } 
    }); 

    // move file 
    $("a.move_file_initial").click(function(event) { 
     event.preventDefault() 
     $(this).hide() 
     $(".move_file_question").show() 
    }); 
    $("a.move_file_question").click(function(event) { 
     if ($(this).hasClass("cancel")) { 
      event.preventDefault() 
      $(".move_file_question").hide() 
      $(".move_file_initial").show() 
     } 
    }); 

});

有两个相似的代码块：删除和移动。除了要加载的实际URL不同之外，它们应该执行相同的操作。预期行为如下。用户点击链接“删除”/“移动”，然后显示确认链接，并确认或取消该操作。

问题是，当我点击链接“delete_file_initial”时，它隐藏，但链接“delete_file_question”不显示，留下一个空行。 “移动”块按预期工作。如果我评论“移动”块，“删除”块将按预期开始工作。更奇怪的是，这个错误出现在Google Chrome 22.0.1229.79中，但在Firefox 15.0.1中一切正常。

如何解决这个错误？

来源

2012-10-10 Dennis Golomazov

铬V.22没有给我任何问题：http://jsfiddle.net/mblase75/cg8Sh/ - 你有没有在控制台中的任何错误？一个想法是：'href'属性不应该是空的; [需要时使用'＃'或'javascript：'作为“空href”]（http://jsfiddle.net/mblase75/cg8Sh/3/）（总是用分号结束JavaScript行也是一个好习惯） – Blazemonger

感谢您的评论。不，我在控制台中没有任何错误（即使在向html添加有问题的'
'后，请参阅我的答案）。它可能是一个jQuery的错误（我使用1.4.4）？ –

的问题是不是在JavaScript，但奇怪的是，在HTML代码。我在<a class="delete_file_initial" href="">Delete file</a>之前删除了第一个<br/>标签，并且它开始正常工作。整个代码块是由<br/>标签分隔的一系列<a>标签。我用一个简单的<ul><li>结构替换了它们，并且问题已经解决，保持原始布局和功能。

如果有人明白这个问题的原因，请让我知道。

来源

2012-10-12 08:01:59

这里的问题是在选择器中，当你使用jQuery（'。classname'）。show（）确保没有多个项目具有相同的类名称。如果你无法提供帮助，请使用.each（）函数。例如，下面是您应该使用的代码。我希望下面的工作

的Javascript：

$(function() { 
    // delete file 
    $("a.delete_file_initial").click(function(event) { 
     event.preventDefault(); 
     $(this).hide(); 
     $(".delete_file_question").each(function(){$(this).show();}); 
    }); 
    $("a.delete_file_question").click(function(event) { 
     if ($(this).hasClass("cancel")) { 
      event.preventDefault() 
      $(".delete_file_question").each(function(){$(this).hide();}); 
      $(".delete_file_initial").show(); 
     } 
    }); 

    // move file 
    $("a.move_file_initial").click(function(event) { 
     event.preventDefault(); 
     $(this).hide(); 
     $(".move_file_question").each(function(){$(this).show();}); 
    }); 
    $("a.move_file_question").click(function(event) { 
     if ($(this).hasClass("cancel")) { 
      event.preventDefault(); 
      $(".move_file_question").each(function(){$(this).hide();}); 
      $(".move_file_initial").show(); 
     } 
    }); 

});

让我知道，如果它还是不

来源

2012-10-10 13:20:05

非常感谢您的答案，但这并没有帮助（请参阅我自己的答案了解详情）。顺便说一句，你能指出我的文档，它写道满足选择器的多个项目可能会导致问题？ –

setTimeout(function(){$(".delete_file_question").each(function(){$(this).show();});},0);

来源

2015-08-18 13:28:11

jQuery show（）在Google Chrome中不起作用

回答

相关问题