JavaScriptのhide/show要素

また、編集ボタンを押したときに表示される「lorem ipsum"」の文字を隠すことはできますか?

``html alt;script type="text/javascript"> 関数 showStuff(id) { document.getElementById(id).style.display = 'block' となります。 }

</script>

td class="post">

a href="#" onclick="showStuff('answer1'); return false;">編集

<textarea rows="10" cols="115">
ソリューション
function showStuff(id, text, btn) {
    document.getElementById(id).style.display = 'block';
    // hide the lorem ipsum text
    document.getElementById(text).style.display = 'none';
    // hide the link
    btn.style.display = 'none';
}

<td class="post">

<a href="#" onclick="showStuff('answer1', 'text1', this); return false;">Edit</a>
<span id="answer1" style="display: none;">
<textarea rows="10" cols="115">
解説 (8)

私は、JQueryという選択肢を提案したいと思います。

$("#item").toggle();
$("#item").hide();
$("#item").show();

例えば、以下のようになります。

$(document).ready(function(){
   $("#item").click(function(event){
     //Your actions here
   });
 });
解説 (3)

挙動はJS、見た目の美しさはCSSと、できるだけ考えてください。HTMLを少し変えるだけで


<td class="post">
    <a class="p-edit-btn" href="#" onclick="showStuff(this.parentNode);return false;">Edit</a>
    <span id="answer1" class="post-answer">
       <textarea rows="10" cols="115">
解説 (0)