Question

我有一个可点击的道场列表项。但同时我们喜欢将输入元素放在列表项中。问题是，如果你单击子元素（示例复选框），listitem onclick首先拦截调用（这似乎与html冒泡格式相反）。所以我们不能在子元素上调用stoppropagation来阻止listitem更改页面。

在下面的示例中，您将看到listitem警报在复选框提醒之前出现..

如何在不触发listitem的情况下处理listitem中的输入元素..

拨弄:: http://jsfiddle.net/theinnkeeper/HFA36/1/

离。

 var list1 = registry.byId("myList");
    var item = new ListItem ({
            label: "A \"programmatic\" ListItem",
            moveTo: "#",
        noArrow:true,
            onClick : function() {
                alert("listItem clicked !" + event.target.type);
            }
        });
        list1.addChild(item);
        var check = new cb({onClick:function(){alert("checkbox clicked");event.stopPropagation();}});
        check.placeAt(item.containerNode.firstChild);
        check.startup();

Answer 1

我有一个类似的问题，并注意到dojox/mobile/ListItem在向其添加额外的事件处理程序（复选框，触摸手势，...）时并不是很好，所以为了解决这个问题我通常会扩展{ {1}}并自行修复事件。

例如：

dojox/mobile/ListItem

由于覆盖了var CheckedListItem = declare("dojox/mobile/CheckedListItem", [ ListItem ], { _initializeCheckbox: function() { this.checkbox = new CheckBox({ }); domConstruct.place(this.checkbox.domNode, this.containerNode.firstChild, "last"); this.checkbox.startup(); this.checkbox.onClick = this.onCheckboxClick; }, onCheckboxClick: function() { }, _setOnCheckboxClickAttr: function(handler) { this.onCheckboxClick = handler; if (this.checkbox !== null && this.checkbox !== undefined) { this.checkbox.onClick = handler; } }, _onClick: function(e) { if (e.target !== this.checkbox.domNode) { this.inherited(arguments); } }, postCreate: function() { this.inherited(arguments); this._initializeCheckbox(); } });并添加了额外的检查，我设法获得了预期的行为。

可在此处找到完整示例：http://jsfiddle.net/LQ6Mb/

具有子输入的Dojo ListItem

1 个答案: