1

我有一个带有 Rails 的网络应用程序。我使用 jQuery 来操作文本选择。

我已经实现了两个 modi:

阅读模式: 用户只能阅读文本。亮点和修改被隐藏。

审阅模式: 用户可以编辑和修改文本。

对于阅读模式,我想阻止触发文本修改的所有功能。

现在我有一个变量inReviewMode。它的布尔值,我在用户单击按钮时触发该值。在代码中,我实现了如下开关:

(CoffeeScript 符号)

jQuery ->
  $(document).on 'contextmenu', 'article#content', (e) ->
    if inReviewMode
      e.preventDefault()
      # and so on... 

  $(document).on 'click', 'article#content', (e) ->
    if inReviewMode
      # something to do

有没有更好的方法,比如将 if 语句包装在所有函数周围,然后在 else 块中实现“阅读模式函数”?

我希望你能理解我的问题。感谢您的帮助!

4

1 回答 1

2

我认为有几件事可以解决这个问题:

  1. 用于stopImmediatePropagation取消对兄弟事件处理程序的通知。
  2. 对您想要取消的所有“编辑”事件使用一个事件处理程序。

换句话说,是这样的:

$ ->
    isReviewMode = false;

    $('#review-yes').change () ->
        isReviewMode = this.checked;

    $(document).on 'click contextmenu', '#content', (e) ->
        if isReviewMode
            e.preventDefault()
            e.stopImmediatePropagation()

    $(document).on 'click', '#content', (e) ->
        alert 'edit mode!'

示例:http: //jsfiddle.net/6zAN7/8/

从示例中可以看出,两者clickcontextmenu不会出现在审阅模式中。

您可以扩展这个想法并提供一个常量变量EditModeEvents,其中包含您要在编辑模式下取消的所有事件:

$ ->
    isReviewMode = false;
    EditModeEvents = ['click', 'contextmenu'];

    $('#review-yes').change () ->
        isReviewMode = this.checked;

    $(document).on EditModeEvents.join(' '), '#content', (e) ->
        if isReviewMode
            e.preventDefault()
            e.stopImmediatePropagation()

    $(document).on 'click', '#content', (e) ->
            alert 'edit mode!'

这样,代码就更清楚了它正在完成的工作,添加新事件所需要做的就是将事件名称添加到EditModeEvents.

此策略假定您在查看模式下对每个事件要做的就是阻止事件发生。如果您需要根据事件执行不同的操作,那么这将无法正常工作——但是您可以使用单独的事件处理程序执行类似的操作。

于 2013-02-17T15:56:22.990 回答