2

私の関数は追加されたクラスを使用せずに完全に実行されていますが、要素にdiva を追加しようとすると機能しません。class

<head>
    <script type="text/javascript">
        function showt(id){
            $('body').append(id)
        }
    </script>
</head>

<body>
    <a href="#" id="hidemain" onmouseover='showt("<div class='sdf'>appended</div>")'>show detail</a>
</body>
4

5 に答える 5

14

他の引用符内で使用する場合は、引用符をエスケープするだけです。また、属性内でそれぞれの他の引用符を使用してください。したがって、属性を"単に使用'し、\'内部および逆に囲む場合。(これについて言及してくれた @nnnnnn に感謝します!)

<a href="#" id="hidemain" onmouseover="showt('<div class=\'sdf\'>appended</div>')">show detail</a>

また

<a href="#" id="hidemain" onmouseover='showt("<div class=\"sdf\">appended</div>')">show detail</a>

編集

イベント オブジェクトを取得するには、次のようにプログラムでイベント ハンドラーを追加する必要があります。

<a href="#" id="hidemain">show detail</a>
<script>
  document.getElementById( 'hidemain' ).addEventListener( 'click', function( event ) {
    showt( '<div class="sdf">appended</div>' );
    // here you have access to event and thus event.pageX
  });
</script>
于 2013-01-09T08:33:59.940 に答える
6

mouseover質問にjQueryのタグを付けたので、属性の代わりにハンドラーを使用するjQueryバージョンをonmouseover次に示します。これにより、引用符のエスケープが完全に無効になります。

<head>
    <!-- include jquery.js here -->
    <script type="text/javascript">
        $(function() {
            $('#hidemain').mouseover(function() {
                showt('<div class="sdf">appended</div>');
            });
        });

        function showt(id){
            $('body').append(id)
        }
    </script>
</head>

<body>
    <a href="#" id="hidemain">show detail</a>
</body>
于 2013-01-09T08:36:30.237 に答える
2

すでに jQuery を使用している場合は、代わりに次のようにします。

$(function() {
    function showt(domElement){
        $('body').append(domElement)
    }

    $("#hidemain").mouseover(function() {
        showt($("<div />").addClass("sdf").text("test"));
    });
})
于 2013-01-09T08:38:30.987 に答える
1

\埋め込まれた引用符を次のようにエスケープする必要があります。

<a href="#" id="hidemain" onmouseover='showt("<div class=\"sdf\">appended</div>")'>show detail</a>

また、内側の引用符を二重引用符に変更し、それらをエスケープしたことに注意してください。外側の引用符がhtml要素属性の周りにある場合、同じタイプの引用符を使用すると、エスケープしても機能しない可能性があるためです。

于 2013-01-09T08:35:02.983 に答える
1

あなたはこれを試すことができます：

onmouseover='showt("<div class=\'sdf\'>appended</div>")'

これらの引用符はエスケープする必要があります'\'。

于 2013-01-09T08:35:26.323 に答える