Question

我有一个HTML图片。在其onClick事件中，我编写了代码来显示日历。我想禁用该图像，这意味着我不能单击该图像，但图像应该是可见的。我想禁用图像的onclick事件。有人可以帮忙吗？

Answer 1

或者不对日历进行任何更改......

<div>Click the button because I am enabled... <img id="btnSubmit" src="submitbutton.gif" onclick="Foobar(this,event);" alt="submit button" /></div>

<p>
<span onclick="ToggleOnclick('btnSubmit');">Click here to disable/enable the image&#39;s onclick</span>
</p>

<script>
    function ToggleOnclick(elID)
    {
        /// <summary>
        /// 
        /// </summary>

        var el = document.getElementById(elID);
        if (el.onclick)
        {
            // Disable the onclick
            el._onclick = el.onclick;
            el.onclick = null;
            alert(el.id +'\'s .onclick has been disabled.');
        }
        else //if (!(button._onclick))
        {
            // Disable the onclick
            el.onclick = el._onclick;
            el._onclick = null;
            alert(el.id +'\'s .onclick has been enabled.');
        }
    }

    function Foobar(el, e)
    {
        alert('Submitting...');
    }
</script>

黄金在ToggleOnclick中。事实上，你可以概括说任何使用它来禁用/启用任何事件。

Answer 2

我认为你有类似的东西：

<a href="#" onclick="cal.prevMonth(); return false;" class="Prev">&nbsp;</a>
...
<script>
    var Calendar = function() {
        var month = ...;

        var updateDisplay = function() {
            ...
        };

        return {
            prevMonth: function() {
                month--;
                updateDisplay();
            }
        };
    };

    var cal = new Calendar();
</script>

Calendar是一个private members的班级，cal是该班级的一个实例。

您需要做的就是向Calendar添加一个新成员，以跟踪是否应禁用onclick，例如isDisabled，并在您onclick中调用的函数中检查此内容，例如

prevMonth: function() {
    if (isDisabled) {
        return;
    }

    month--;
    updateDisplay();
}

Answer 3

最简单的方法是使用一些隐藏字段或javascript变量

HiddenField：

<asp:HiddenField id="hdnValue" runat="server" value="true"/>

<script type="text/javascript">
function ImageClickHandler(){
   var i=document.getElementById(<%=hdnValue.ClientID%>).Value; 
  //don't know if .value works because I'm very much into jQuery 

 if(i=='true') //go ahead and show calendar
 else //don't show !
}
</script>

变量：

var showCal = "<%= VARIABLE_TO_SET_IF_CAL_ENABLED%>";

<script type="text/javascript">
function ImageClickHandler(){
 if(showCal=='true') //go ahead and show calendar
 else //don't show !
}
</script>

Answer 4

如前所述，只需在onclick处理程序中添加一个条件。

<script type="text/javascript">

 var _imageClickDisabled = false;

 function disableImageClick()
 {
  _imageClickDisabled = true;
 }

 function onImageClick()
 {
   if (_imageClickDisabled)
   {
     return;
   }

   // show your calendar here
   //
   // : : :
 }

</script>

<img ... onclick="onImageClick()" />

只需调用disableImageClick（）函数即可停止显示日历。

Answer 5

嗨，现在已经很晚了，

但是我也有相同的要求，我已经通过将输入元素替换为类型为图像的图像标记来修复它，此元素的好处是它将图像显示为输入元素，禁用属性将允许您禁用单击事件。以下是我使用的代码

<input type="image" src="<date icon>" 
onclick="return showCalender('txtdate','dd\mm\y');" disabled="disabled"></input>

请注意，已禁用的属性仅适用于与表单相关的元素

思想可能对将来的其他人有所帮助。

要禁用图像

5 个答案: