ここの初心者。元の要素を非表示にしようとしているときに、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;
});
});