このスポイラーコードがあります。
HTML:
<input type='button' class="splLink" value='Show'>
<div class="splCont">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<br />
<input type='button' class="splLink" value='Show'>
<div class="splCont">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <br />
<input type='button' class="splLink" value='Show'>
<div class="splCont">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
</div>
</div>
JavaScript:
$(document).ready(function() {
$(".splLink").click(function() {
$(this).next().slideToggle("fast");
$(this).val($(this).val() == 'Show' ? 'Hide' : 'Show');
return false;
});
});
CSS:
.splCont {
display: none;
padding-top: 10pt;
}
.splLink {
font-family: arial, verdana, ms sans serif;
cursor: pointer;
}
例: JSFIDDLE
コードでボタンのデフォルト値を追加する方法を教えてもらえますか?値属性なしでhtmlでスポイラーを使用できますか? そんな感じ:
<input type='button' class="splLink">
<div class="splCont">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>