0

htmlコード

<li id="ioAddOtherRelation">
            <a href="" onclick="return ioAddSetOtherRelation()"class="smallLink">add other relation</a>
</li>

関数ioAddSetOtherRelationでタグを削除したい

javascriptコード

function ioAddSetOtherRelation(){
    var bigLi = document.getElementById('ioAddOtherRelation');
    bigLi.removeChild(bigLi.childNodes[0]);
    return false;
}

初めてリンクを押すと何も起こらなかったのですが、2回押すとタグが外れるのでワンクリックでタグを外したい

4

3 に答える 3

3

初めてクリックしたときに、要素の前のスペースを含むテキストノードを削除しました。渡す引数がremoveChild実際に必要な引数であることを確認する必要があります。

これは、問題へのより適切なアプローチになります。

<li id="ioAddOtherRelation">
    <a href="" onclick="return ioAddSetOtherRelation(this)" class="smallLink">add other relation</a>
</li>

function ioAddSetOtherRelation(element){
   var bigLi = element.parentNode;
    bigLi.removeChild(element);
    return false;
}

固有のイベント属性を取り除き、控えめなJavaScriptを作成する方がよいでしょう。

于 2012-05-11T08:34:32.050 に答える
2

投稿したコードの問題は、「li」要素の最初の子が、実際には、それ自体と「a」要素の間に改行と空白を含むtextNodeであるということです。初めてクリックすると、この非表示のtextNodeが削除され、2回目にクリックすると「a」が削除されます。

これを示すには、改行と空白を削除します(つまり、すべてのHTMLをスペースなしで1行に配置します)。最初のクリックで「a」が消えるはずです。

次の変更されたJavaScriptが意図したとおりに機能することがわかりました。.getElementsByTagName()を使用して、「a」要素のみが返されるようにしたことに注意してください。これは.childNodesのように配列を返すので、結果の配列の最初の要素を取得します。

          function ioAddSetOtherRelation() {
          var bigLi = document.getElementById('ioAddOtherRelation');
          bigLi.removeChild(bigLi.getElementsByTagName("a")[0]);
          return false;
      }

FireBugは、この問題を解決するのに非常に役立つことがわかりました(JSコードのconsole.debug()行と一緒に)-まだ使用していない場合は、試してみることをお勧めします!

于 2012-05-11T08:51:12.167 に答える
1

jQueryを使用し、パラメータを次のように送信しますthis

thisioAddSetOtherRelation関数でそれを取ります

こちらで確認してください

于 2012-05-11T08:38:03.690 に答える