Question

我试图找出一个脚本，当点击按钮时禁用日历不会显示并单击启用日历将再次显示。对于禁用功能，我使用readonly方法而不是禁用，但是如何删除data-plugin属性？

演示网站：https://test.e-cover.com.my/pib/test/test.jsp

浏览器使用：Chrome

  <%for(int i =0; i<3; i++){%>
  <div class="input-group">
    <span class="input-group-addon"><i class="icon wb-calendar" aria-hidden="true"></i></span>
    <input type="text" name="DOB_<%=i%>" id="DOB_<%=i%>" value="" class="form-control tt-input brdr1" data-plugin="datepicker" maxlength="10">
  </div>
  <br/>
  <%} %>

<input type="button" value="disabled" onclick="fnDisable()">
<input type="button" value="enable" onclick="fnEnable()">

脚本

function fnEnable()
{

    for(var i=0;i<3;i++)
   {
      document.getElementById("DOB_"+i).readOnly = false;
       document.getElementById("DOB_"+i).style.backgroundColor ="#FFFFFF";
    }
}

function fnDisable()
{
  for(var i=0;i<3;i++)
  { var v = document.getElementById("DOB_"+i);
    document.getElementById("DOB_"+i).readOnly = true;
    document.getElementById("DOB_"+i).style.backgroundColor ="#DDDDDD";


    //v.removeAttribute("data-plugin");
    //delete v.dataset.plugin;
   }
}

此removeAttribute("data_plugin");或此作品delete v.dataset.plugin;都不是。

Answer 1

delete v.dataset.plugin应删除数据属性。您的问题不是数据属性。基本上，因为Calendar小部件已经加载到页面上。窗口小部件已初始化并引用了DOM元素。将readOnly标志设置为true仅禁用更改内容，而不是单击处理程序。

<强>解决方案：您需要插入＆＃34;禁用＆＃34;属性到您的输入框以禁用交互。

禁用：element.disabled = true; 启用：element.removeAttribute('disabled');

如何使用javascript删除data-plugin属性

脚本

1 个答案: