草庐IT

javascript - Div 的相互点击？

coder 2024-07-23 原文

我有一个包含的 div，它本身充当一个按钮...

点击时，我将其设置为展开并显示更多信息，同时在右上角显示一个关闭按钮...

现在，当我点击关闭按钮时，关闭函数会执行，而且 div 的 onclick 也会打开，所以最终结果是，好吧......没有任何反应......

大声笑...

fiddle 的例子也不管用，我快没脑子了...

http://jsfiddle.net/VeyeY/5/

最佳答案

您可以从 onclick 返回 false 以关闭 div。这将确保不会传播点击事件。

另一种解决方案是对事件本身调用 preventDefault() 和 stopPropagation()。这也将确保事件不会继续进行。

编辑:

在所有发生的事件(onclick、onchange、onmouseover 等)中，总有一个可能的事件变量，您可以根据需要忽略它，或者从中提取信息。在您的示例中，我认为使用事件变量的最简单方法是执行如下操作:

<div id="inner" onclick="toggle(false); event.preventDefault(); event.stopPropagation();">

现在这看起来有点难看，你真的不想在 html 标记中处理这个，所以另一种选择是像这样将事件变量传递给你的函数:

<div id="inner" onclick="toggle(event, false)">

然后在 javascript 中:

function toggle(event, x){
    // Do your thing

    event.preventDefault();
    event.stopPropagation();
}

事件变量可以做很多事情。例如，您可以检查发起事件的节点，而不是将 true 或 false 传递给您的函数:

if(event.originalTarget.id == "inner"){
    // Inner was clicked
}else if(event.originalTarget.id == "outer"){
    // Outer was clicked
}

关于javascript - Div 的相互点击？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6341116/

javascript相互codesectionevent

有关javascript - Div 的相互点击？的更多相关文章

  1. ruby-on-rails - Nokogiri:使用 XPath 搜索 <div> - 2

    我使用Nokogiri(Rubygem)css搜索寻找某些在我的html里面。看起来Nokogiri的css搜索不喜欢正则表达式。我想切换到Nokogiri的xpath搜索，因为这似乎支持搜索字符串中的正则表达式。如何在xpath搜索中实现下面提到的(伪)css搜索？require'rubygems'require'nokogiri'value=Nokogiri::HTML.parse(ABBlaCD3"HTML_END#my_blockisgivenmy_bl="1"#my_eqcorrespondstothisregexmy_eq="\/[0-9]+\/"#FIXMEThefoll

  2. ruby - 如何使用 Selenium Webdriver 根据 div 的内容执行操作？ - 2

    我有一个使用SeleniumWebdriver和Nokogiri的Ruby应用程序。我想选择一个类，然后对于那个类对应的每个div，我想根据div的内容执行一个Action。例如，我正在解析以下页面:https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=puppies这是一个搜索结果页面，我正在寻找描述中包含“Adoption”一词的第一个结果。因此机器人应该寻找带有className:"result"的div，对于每个检查它的.descriptiondiv是否包含单词“adoption

  3. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  4. ruby - Sinatra:点击 URL 时运行 ruby​​ 代码 - 2

    我想在每次访问url/code时运行一个脚本(code.rb)。如何运行脚本？require'sinatra'get'/'do#runthescriptend 最佳答案 要么fork另一个进程:system('rubycode.rb')...或者简单地将脚本加载到当前上下文中:load'code.rb'#*not*require 关于ruby-Sinatra:点击URL时运行ruby​​代码，我们在StackOverflow上找到一个类似的问题： https:

  5. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  6. ruby - 难倒点击与 nokogiri 和 Mechanize 的链接 - 2

    也许我做错了，或者还有另一种更有效的方法。这是我的问题:我首先使用nokogiri打开一个html文档并使用其css遍历该文档，直到找到我需要单击的链接。现在我有了链接后，如何使用Mechanize来点击它？根据文档，Mechanize.new返回的对象是字符串或Mechanize::Page::Link对象。我不能使用字符串-因为可能有100个相同的链接-我只想Mechanize点击nokogiri遍历的链接。有什么想法吗？ 最佳答案 找到所需的链接节点后，您可以手动创建Mechanize::Page::Link对象，然后单击它:

  7. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的？ 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map，但任何事情都可能发生)首先要知道的是，这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  8. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss？ - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中，html表单使用tinymce将“content”列设置为textarea字段。在首页，因为使用了tinymce，post.html.erb的代码需要用这样的原始方法来实现。.好的，现在如果我关闭浏览器javascript，这个文本区域可以在没有tinymce的情况下输入，也许用户会输入任何xss，比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中，但sanitize方法将相互过滤tinymce样式。例如

  9. ruby - 使用 Selenium WebDriver 启用/禁用 javascript - 2

    出于某种原因，我必须为Firefox禁用javascript(手动，我们按照提到的步骤执行http://support.mozilla.org/en-US/kb/javascript-settings-for-interactive-web-pages#w_enabling-and-disabling-javascript)。使用Ruby的SeleniumWebDriver如何实现这一点？ 最佳答案 是的，这是可能的。而是另一种方式。您首先需要查看链接Selenium::WebDriver::Firefox::Profile#[]=

  10. ruby - 为什么会.is_a？和 .class 给出相互矛盾的结果？ - 2

    我有三个属于同一个类的对象。一个是通过Item.new创建的，另外两个是从数据库(Mongoid)中提取的。我将这些对象中的一个/任何一个传递给另一个方法，并通过is_a?检查该方法中的类型:definitialize(item,attrs=nil,options=nil)super(attrs,options)raise'invaliditemobject'unlessitem.is_a?(Item)好吧，这次加薪被击中了。所以我在Rails控制台中检查类、is_a和instance_of。我得到相互矛盾的结果。为什么它们有相同的class但只有其中一个是那个class的instan

随机推荐