新手在这里。我正在尝试使用 jquery wrapInner 为用户显示下一个选择,同时尝试隐藏原始元素。这是我的jsfiddle。
一旦我单击认可单选按钮,它就会隐藏中间的元素。取消按钮显示元素。但是再次单击认可单选按钮没有任何反应。
对此的任何帮助将不胜感激!
html:
<div id="engr-action" >
<div id="engr-choice">
<input id="endorse" class="engr-choice" type="radio" name="encoder-pick"/>
<label for="endorse">ENDORSEMENT</label>
<input id="encode" class="engr-choice" type="radio" name="encoder-pick"/>
<label for="encode">ENCODE</label>
</div>
<button id="cancel-action">Cancel</button>
</div>
jQuery:
$(function(){
$('#engr-choice').buttonset();
$('#cancel-action')
.button()
.click(function() {
$('#engr-choice').html('');
$('#endorse-edit').hide();
$('#engr-choice').wrapInner('<input id="endorse" class="engr-choice" type="radio" name="encoder-pick"/><label for="endorse">ENDORSEMENT</label>');
$('#engr-choice input').removeAttr('checked');
$('#engr-choice').buttonset('refresh');
return false;
});
$('#endorse').click(function(){
$('#engr-choice').html('');
$('#engr-choice').wrapInner('<div id="endorse-edit"><a href="">Edit</a></div>');
$('#endorse-edit').button();
return false;
});
});