Question

我正试图在event.namespace mouseup上实现event，但它似乎不起作用，它始终记录undefined

// find elements
var banner = $("#banner-message")
var button = $("button")

// handle click and add class
$(document).on("mouseup", function(event) {
  console.log(event)
  banner.hasClass("alt") ? banner.removeClass("alt") : banner.addClass("alt")
})


$(document).on("mouseup.namespace", function(event) {
  console.log(event.namespace)
})

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#banner-message {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  font-size: 25px;
  text-align: center;
  transition: all 0.2s;
  margin: 0 auto;
  width: 300px;
}

button {
  background: #0084ff;
  border: none;
  border-radius: 5px;
  padding: 8px 14px;
  font-size: 15px;
  color: #fff;
}

#banner-message.alt {
  background: #0084ff;
  color: #fff;
  margin-top: 40px;
  width: 200px;
}

#banner-message.alt button {
  background: #fff;
  color: #000;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<div id="banner-message">
  <p>Hello World</p>
  <button>Change color</button>
</div>

这是我尝试过的一个小提琴：http://jsfiddle.net/xpvt214o/221833/有什么想法吗？

Answer 1

你需要触发extension=geos.dll 例如https://api.jquery.com/event.namespace/

另外，从mouseup.namespace更改名称空间名称，因为它会触发事件两次

mouseup.namespace

// find elements
var banner = $("#banner-message")
var button = $("button")

// handle click and add class
$(document).on("mouseup", function(event) {
  console.log(event);
  banner.toggleClass("alt");
  $(this).trigger("mouseup.namespace");
})


$(document).on("mouseup.namespace", function(event) {
  console.log(event.namespace);
})

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#banner-message {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  font-size: 25px;
  text-align: center;
  transition: all 0.2s;
  margin: 0 auto;
  width: 300px;
}

button {
  background: #0084ff;
  border: none;
  border-radius: 5px;
  padding: 8px 14px;
  font-size: 15px;
  color: #fff;
}

#banner-message.alt {
  background: #0084ff;
  color: #fff;
  margin-top: 40px;
  width: 200px;
}

#banner-message.alt button {
  background: #fff;
  color: #000;
}

Answer 2

你这样做是错误的。试试这个。

var banner = $("#banner-message")
var button = $("button")

$(document).on("namespace.someNamespace", function(event) {
  console.log(event);
  console.log(event.namespace);
  banner.hasClass("alt") ? banner.removeClass("alt") : banner.addClass("alt")
});

$(document).on("mouseup", function(event) {
  $(document).trigger('namespace.someNamespace');
});

您需要一个正常事件（例如mouseup）来触发命名空间事件。

Answer 3

event.namespace由jQuery插件用于组织自定义事件

event.namespace | jQuery API Documentation

这可能主要由希望根据所使用的事件命名空间以不同方式处理任务的插件作者使用。

无论您想做什么，似乎命名空间都不是您正在寻找的工具。

事件命名空间不在“mouseup”事件中工作

3 个答案: