如何在内联javascript函数中转义引号_Javascript_Jquery

如何在内联javascript函数中转义引号

javascript jquery

如何在内联javascript函数中转义引号,javascript,jquery,Javascript,Jquery,我的函数运行得很好，没有在追加的div中使用class，但是当我尝试在元素上添加class时，它不起作用 <head> <script type="text/javascript"> function showt(id){ $('body').append(id) } </script> </head> <body> <a href="#" id="

我的函数运行得很好，没有在追加的

div

中使用class，但是当我尝试在元素上添加

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>


函数showt（id）{
$（'body'）.append（id）
}

当在其他引号中使用时，只需转义引号。也只需在属性中使用相应的其他引号。因此，如果您将属性括在

“

中，只需使用

”

和

和vica-verse即可。（感谢@nnnn提到这一点！）

或

编辑

为了获取事件对象，您应该按如下方式以编程方式添加事件处理程序：

<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>


document.getElementById（'hidemain'）.addEventListener（'click'，函数（事件）{
showt（‘附加’）；
//在这里，您可以访问event，从而访问event.pageX
});

您需要用

转义嵌入的引号：

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

请注意，我还将内部引号更改为双引号，并将其转义，因为如果外部引号位于html元素属性周围，则在其中使用相同类型的引号，即使转义也可能不起作用。

您可以尝试以下方法：

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

onmouseover='showt（“追加”）'

这些引号需要转义

'\'

因为你用jQuery标记了你的问题，这里的jQuery版本使用了

mouseover

处理程序，而不是

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>


$（函数（）{
$（'#hidemain'）.mouseover（函数（）{
showt（'附加'）；
});
});
函数showt（id）{
$（'body'）.append（id）
}

如果您已经在使用jQuery，则可以执行以下操作：

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

    $("#hidemain").mouseover(function() {
        showt($("<div />").addClass("sdf").text("test"));
    });
})

$（函数（）{
功能显示（DOMELENT）{
$（'body'）.append（domeElement）
}
$（“#hidemain”）.mouseover（函数（）{
showt（$（“”）.addClass（“sdf”）.text（“test”）；
});
})

为什么不在脚本中绑定事件处理程序，而不是在元素中内联？变量名“id”并不准确，这里有人能告诉我如何从中获取pageX吗function@jchand什么是

pageX

？您的代码中没有指定它。我建议对HTML代码使用双引号。谢谢，它正在工作。我想要还有一件事，如何从这个函数中获取pageX你是否直接在html中测试了转义？在Chrome中不起作用：（不确定其他浏览器）。它需要使用与html属性周围的任何内容相反的引号类型…我刚刚发布了相同的答案，该死的…-）

<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>

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

    $("#hidemain").mouseover(function() {
        showt($("<div />").addClass("sdf").text("test"));
    });
})