选中了jQuery contextMenu复选框

时间:2017-06-26 07:53:00

标签: javascript jquery contextmenu

我正在使用SWIS的contexMenu而且我不知道如何从复选框中更改所选的值。 我有这个代码:

function isOk(){
    return false;
}

$.contextMenu({
    selector: "td[name*='someSelector']", 
    callback: function(key, options) {
        var m = "clicked: " + key + " id: "+ this.attr('id');
        window.console && console.log(m) || alert(m);
    },
    items: {
        "okOption": {
            name: "ok", 
            type: 'checkbox', 
            selected: function(){ return isOk(); }
        },
        "quit": {
            name: "Close Menu", 
            icon: function(){
                return 'context-menu-icon context-menu-icon-quit';
            }
        }
    }
});

但复选框始终为真。

我不知道出了什么问题,或者所选择的内容是否适用于某项功能,只能使用true或false。



function isOk(){
			return false;
		}
		
		$.contextMenu({
			selector: "[name*='someSelector']", 
			callback: function(key, options) {
				var m = "clicked: " + key + " id: "+ this.attr('id');
				window.console && console.log(m) || alert(m);
			},
			items: {
				"okOption": {
					name: "ok", 
					type: 'checkbox', 
					selected: {function(){ return isOk(); }}
				},
				"quit": {name: "Close Menu", icon: function(){
					return 'context-menu-icon context-menu-icon-quit';
					}
				}
			}
		});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://swisnl.github.io/jQuery-contextMenu/dist/jquery.contextMenu.js"></script>
<script src="https://swisnl.github.io/jQuery-contextMenu/js/theme.js"></script>
<link href="https://swisnl.github.io/jQuery-contextMenu/dist/jquery.contextMenu.css" rel="stylesheet"/>

<span name="someSelector"> ClickRightHere</span>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:1)

最后我用一个事件解决了: 这里的解决方案片段供未来人员参考和解决。

&#13;
&#13;
function isOk() {
  return false;
}

$.contextMenu({
  selector: "[name*='someSelector']",
  callback: function(key, options) {
    var m = "clicked: " + key + " id: " + this.attr('id');
    window.console && console.log(m) || alert(m);
  },
  items: {
    "okOption": {
      name: "ok",
      type: 'checkbox'
    },
    "quit": {
      name: "Close Menu",
      icon: function() {
        return 'context-menu-icon context-menu-icon-quit';
      }
    }
  },
  events: {
    show: function(opt) {
      // this is the trigger element
      var $this = this;
      // import states from data store 
      $this.data().okOption = isOk();

      $.contextMenu.setInputValues(opt, $this.data());
      // this basically fills the input commands from an object
      // like {name: "foo", yesno: true, radio: "3", &hellip;}
    }
  }
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://swisnl.github.io/jQuery-contextMenu/dist/jquery.contextMenu.js"></script>
<script src="https://swisnl.github.io/jQuery-contextMenu/js/theme.js"></script>
<link href="https://swisnl.github.io/jQuery-contextMenu/dist/jquery.contextMenu.css" rel="stylesheet" />

<span name="someSelector"> ClickRightHere</span>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

您无法使用selected选项的功能。 documentation说:

  

selected:string或boolean

所以你可以使用这样的变量:

var myFlag = false;

$.contextMenu({
    ...
    items: {
        "okOption": {
            name: "ok", 
            type: 'checkbox', 
            selected: myFlag
        },
    ...