使用Javascript/JQuery以编程方式禁用嵌套Div中的OnClick

问题描述：

我有一个Javascript应用程序，它允许用户在运行时启用/禁用控件。我已经禁用/启用嵌套输入和按键是成功的，但到目前为止，我曾在禁用在一个div onclick事件没有成功，这样圆圈图标将无法选择：使用Javascript/JQuery以编程方式禁用嵌套Div中的OnClick

的生成的HTML如下：

<div id="56f81c3d-9666-4dab-8f35-d36e894f426f" class="field alert-success"> 
    <div class="field-name">By default I am disabled - Single Photo</div> 
     <div id="56f81c3d-9666-4dab-8f35-d36e894f426fPhoto" class="clearfix" style="cursor: pointer; max-width: 100%; max-height: 100%;" onclick="ffffield.getFieldHandler('PhotoPicker').showPhotoCapture(this, '56f81c3d-9666-4dab-8f35-d36e894f426f');"> 
      <img class="pull-right" src="/MySite.Web/Content/device/images/chevronRight.png" style="width: 20px; position:relative; top: 7px;"> 
      <img class="pull-right" src="/MySite.Web/Content/device/images/[email protected]" style="width: 40px; position:relative; top: -5px;"> 
     </div> 
    </div> 
</div>.

在这个片段中，它是“点击”我需要禁用。我不挑剔 - 它可以禁用指针或onclick。

我曾尝试以下尝试，使这项工作：

$("#56f81c3d-9666-4dab-8f35-d36e894f426f").children().off('click');

和

$("#56f81c3d-9666-4dab-8f35-d36e894f426f input").prop("disabled", true);

和

$("#"#56f81c3d-9666-4dab-8f35-d36e894f426f input").attr("disabled", true);

和

$(""#56f81c3d-9666-4dab-8f35-d36e894f426f input").attr("disabled", "disabled");

基于一些其他的stackoverflow问题。

http://stackoverflow.com/questions/18982642/如何禁用，然后启用onclick事件的div与 - javascript – epascarello

'div [disabled] {pointerEvents：none; }' – epascarello

@epascarello谢谢你的回应。我在上面的stackflow上尝试了接受的答案。什么是jQuery的方式来设置禁用指针？ –

答

.off()只能禁用添加了.on()（或其他jQuery方法，因为它们都在内部调用.on()）添加的事件侦听器。若要移除使用onclick属性添加事件侦听器，则需要重新分配onclick属性：

$("#56f81c3d-9666-4dab-8f35-d36e894f426f").children().prop('onclick', null);

这就像一个魅力。如何重新启用它，因为用户可以切换它？ –

将旧值保存在变量中。 – Barmar

不幸的是，我不能保存最后的值，因为可以有数百个这样的实例（除非我构建了一个全新的构造）。但我可以重新生成相同的方法。在这种情况下，这看起来如何？ $（“＃”+ targetField.id）.on（'click'，“ffffield.getFieldHandler（'PhotoPicker'）。showPhotoCapture（this，'”+ targetField.id +“Photo'）;”）; targetField.id是＃56f81c3d-9666-4dab-8f35-d36e894f426f？ –

答

试试这个代码：

function disableDiv(div) { 
    div.addEventListener("click", function (event) { 
     event.stopPropagation(); 
    }, true); 
} 

// call the disable div handler 
disableDiv(document.getElementById("56f81c3d-9666-4dab-8f35-d36e894f426f"));

使用Javascript/JQuery以编程方式禁用嵌套Div中的OnClick

相关推荐