【问题标题】:Options is not working in Materialize and remove method is also not working when i use jQuery append method当我使用 jQuery append 方法时,选项在 Materialize 中不起作用,并且 remove 方法也不起作用
【发布时间】:2018-08-04 04:12:20
【问题描述】:

我在我的项目中使用了物化 css,当我想在物化选择中附加选项时遇到问题。

请查看我的 sn-p 并进行必要的更改以帮助我。谢谢

$(document).ready(function() {
  $(".condition").click(function() {
    $('.shw').append($('.hidden').clone().removeClass("hidden"));
  });
});
$(document).ready(function() {
  $(".delete").click(function() {
    $('.hidden').remove();
  });
});
.hidden {
  display: none
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
<div class="hidden">
  <fieldset>
    <table class='addRuleHolder'>
      <tr>
        <td class="label-col">
          <label>Sensor:</label>
        </td>
        <td>
          <select>
            <option value="1">S1</option>
            <option value="2">S2</option>
          </select>
        </td>
      </tr>
      <tr>
        <td class="label-col">
          <label>Threshold Value:</label>
        </td>
        <td>
          <input type="text">
        </td>
      </tr>
    </table>
<button  class="waves-effect waves-light btn delete"  >delete</button>
  </fieldset>
</div>


<div style="margin-top: 20px; float:right;padding-right:15px">
  <button class="waves-effect waves-light btn condition"  value="Add">condition</button>
</div>
<br style="clear:both"/>
<div class="shw"></div>

感谢您的帮助,抱歉我的英语不好。

【问题讨论】:

    标签: javascript jquery css angularjs materialize


    【解决方案1】:

    您甚至应该删除在删除时附加的 div,否则它将不起作用。

    【讨论】:

    • 你能说得更具体一点吗?我没找到你
    【解决方案2】:

    这是 select 的工作脚本

    $(document).ready(function() {
     $('select').attr("class", "browser-default")
    });
    

    删除div,下面是脚本

       $('.shw').on('click', '.delete', function(e) {
    e.preventDefault();
    $(this).parent().remove();
    });  
    

    【讨论】:

    猜你喜欢
    • 2013-10-06
    • 1970-01-01
    • 2018-04-29
    • 1970-01-01
    • 1970-01-01
    • 2020-06-20
    • 2016-08-04
    • 1970-01-01
    • 2021-01-02
    相关资源
    最近更新 更多