Question

我在MVC视图中有以下html

router.route('/register').post((req, res, next) => {
  console.log('this bit here works');
  passport.authenticate('local', function(error, user, info) {
    console.log("it's here that something should happen now.");
    if (error) {
      return res.status(500).json(error);
    }
    return res.json(user);
  })(req, res, next);
})

然后我有以下javascript代码

user

<div class="main-container"> <link href="/Content/styles.css" rel="stylesheet" /> <link href="/Content/contextmenu.css" rel="stylesheet" /> <div class="filemanager"> <div class="search"> <input type="search" placeholder="Find a file.." /> </div> <div class="breadcrumbs"></div> <ul class="data"> </ul> @*<div class="nothingfound"> <div class="nofiles"></div> <span>No files here.</span> </div>*@ </div> <script src="/Scripts/contextmenu.js"></script> <script src="/Scripts/script.js"></script> </div>由文件和文件夹填充，每个文件的function FileRightClick(item) { // Show contextmenu $("#copymenu").finish().toggle(100).css({ top: event.pageY + "px", left: event.pageX + "px" }); return false; }; $(".main-container").bind("contextmenu", function (event) { // Avoid the real one event.preventDefault(); // Show contextmenu $("#pastemenu").finish().toggle(100). // In the right position (the mouse) css({ top: event.pageY + "px", left: event.pageX + "px" }); });包含以下代码<ul class="data">但是，如果我右键单击文件中的任何位置，则会弹出两个菜单。但如果我右键单击没有文件或文件夹的地方，则显示#pastmenu。

如何防止将<li>调用到oncontextmenu="return FileRightClick(this);"

中？

Answer 1

首先要注意的是＆＃34; .bind＆＃34;已被弃用，并在几年前被取代 - 您应该使用＆＃34; .on＆＃34;。见http://api.jquery.com/bind/。

无论如何，如果你使用jQuery委托事件定义你的FileRightClick（通过＆＃34; on＆＃34; :-)），你可以轻松使用stopPropagation https://api.jquery.com/event.stoppropagation/来阻止点击主容器。这是有效的，因为这个命令阻止事件冒出更高的DOM，所以＆＃34; maincontext＆＃34; element永远不会收到点击事件。

有关委派事件的更多信息（无需为动态创建的事件使用内联事件语法），请参阅＆＃34;直接和委派事件＆＃34;部分下的http://api.jquery.com/on/。

＆＃13;

$(function() {
  $(".main-container").on("contextmenu", function(event) {

    // Avoid the real one
    event.preventDefault();
    alert("main context menu");
  });

  $(".data").on("contextmenu", "li", function(event) {

    // Avoid the real one
    event.preventDefault();
    event.stopPropagation();
    alert("individual data context menu");
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="main-container">

  <div class="filemanager">
    <div class="search">
      <input type="search" placeholder="Find a file.." />
    </div>
    <div class="breadcrumbs"></div>
    <ul class="data">
      <li>Data - Right Click Me</li>
      <li>Data - Right Click Me 2</li>
    </ul>
  </div>

</div>

＆＃13;

防止点击事件javascript

1 个答案: