Динамически активировать кнопку пользовательского интерфейса jquery, которая ранее была отключена для события javascript
У меня есть два деления. Нажатие на кнопку jqueryui (button1) в первом div (div1) создает кнопку пользовательского интерфейса jquery (button2) во втором div (div2) с элементом данных, идентифицирующим button1, которая его создала; также щелчок скрывает (или отключает работает тоже) нажатую кнопку (button1).
Когда я нажимаю на button2, я хочу показать / включить button1; Однако это не работает. Это кажется проблемой только с динамически скрытыми / отключенными кнопками.
<div id="pane1>
<a id="123" class="addme jqb">Add</a>
</div>
<div id="pane1>
<a id="345" data-target='123' class="deleteme jqb">Delete</a>
</div>
$(function(){
$('.jqb').button();
$('.deleteme').button('disable');
$('.addme').on("click", function(){
$(this).button('disable');
$('.deleteme').button('enable');
});
$('.deleteme').on("click", function(){
$(this).button('disable');
$('#123').button('enable');
});
});
Вот скрипка, содержащая упрощенную версию кода - https://jsfiddle.net/x7u1xLg8/16/
2 ответа
Возможно, ваш HTML не верен. Например, вы забыли закрыть двойные кавычки. Это молча провалится и будет иметь странные последствия.
<div id="pane1>
Вы пропустили ""
в двух местах:
<div id="pane1>
<a id="123" class="addme jqb">Add</a>
</div>
<div id="pane1>
<a id="345" data-target='123' class="deleteme jqb">Delete</a>
</div>
Пожалуйста, проверьте обновленный код (обратите внимание, проверьте код в скрипте).
$(function(){
$('.jqb').button();
$('.addme').on("click", function(){
$(this).button('disable');
$('#345').button('enable');
});
$('.deleteme').on("click", function(){
$(this).button('disable');
$('#123').button('enable');
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script
src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
<div id="pane1">
<a id="123" class="addme jqb">Test</a>
</div>
<div id="pane1">
<a id="345" data-target='123' class="deleteme jqb">Test1</a>
</div>