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

Question

我有一个 Javascript 应用程序，允许用户在运行时 enable/disable 进行控制。我已经在 disabling/enabling 嵌套输入和按钮中成功了，但是到目前为止我在 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/photoPickerPlaceholder@2x.png" 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");

基于其他一些 Whosebug 问题。

Answer 1

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

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

Answer 2

试试这个代码：

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

Disabling the OnClick in a nested Div programmatically with Javascript/JQuery

html

javascript

jquery

disabled-input