Question

我有这段代码一直在抛出错误。我搜索过，但没有发现任何接近这种类型的代码导致此错误。主要是ajax次调用中的问题。这不是ajax电话。开发工具告诉我它正在这行代码中发生

<html>

我觉得这并不能说明整个故事。错误是 -

Uncaught SyntaxError: Unexpected token }

以下是代码：

<a href="javascript:void(0);"
        data-toggle="popover"
        data-container="body" 
        data-placement="right"  
        data-trigger="focus" 
        data-content="<i class='fa fa-envelope-o fa-lg'></i> <a href='#contact' id='share-email' onclick='scrollElement('#contact')'>info@h3webelements.com</a><br>
            <i class='fa fa-phone fa-lg'></i> 405.456.9447<br>
            <i class='fa fa-globe fa-lg'></i><a href='#footer' onclick='scrollElement('#footer')'> Warr Acres, Oklahoma</a><br>
            <i class='fa fa-twitter-square fa-lg'></i><a href='http://www.twitter.com/h3webelements' target='_blank'> @H3WebElements</a><br>
            <i class='fa fa-facebook-official fa-lg'></i><a href='https://www.facebook.com/H3WebElements' target='_blank'> H3 Web Elements</a></br>"
        data-html="true">
        <i class="fa fa-user fa-3x"></i></a>

使用Javascript：

function scrollElement (target) {
     $('html, body').animate({
          scrollTop: $(target).offset().top
      }, 1500);

 }

请注意，scrollElement功能可以在页面的其他方面正常运行，例如navbar。我相信问题出在我用作固定位置元素弹出窗口的链接的data-content部分。我被迫使用单'个引号。我试图逃避\'并使用\"，但这最终打破了一切。这应该像我的导航栏一样滚动到元素，现在它只是直接将它带到选定的元素。

由于

Answer 1

问题确实存在于重复的单引号中：

onclick='scrollElement('#contact')'

由于此代码位于属性值中，因此我们可以使用HTML实体进行转义报价：

onclick=&quot;scrollElement('#contact')&quot;

这是一个工作片段。请注意，只有popover中的电子邮件链接已更正：

jQuery(function($){
   $( 'a' ).popover();
})

function scrollElement(target) {
  console.log("scrollElement", target);
     $('html, body').animate({
          scrollTop: $(target).offset().top
      }, 1500);

 }

#contact { position: relative;top:1000px }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet"/>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>

<a href="javascript:void(0);"
        data-toggle="popover"
        data-container="body" 
        data-placement="right"  
        data-trigger="focus" 
        data-content="<i class='fa fa-envelope-o fa-lg'></i> <a href='#contact' id='share-email' onclick=&quot;scrollElement('#contact')&quot;>info@h3webelements.com</a><br>
            <i class='fa fa-phone fa-lg'></i> 405.456.9447<br>
            <i class='fa fa-globe fa-lg'></i><a href='#footer' onclick='scrollElement('#footer')'> Warr Acres, Oklahoma</a><br>
            <i class='fa fa-twitter-square fa-lg'></i><a href='http://www.twitter.com/h3webelements' target='_blank'> @H3WebElements</a><br>
            <i class='fa fa-facebook-official fa-lg'></i><a href='https://www.facebook.com/H3WebElements' target='_blank'> H3 Web Elements</a></br>"
        data-html="true">
        <i class="fa fa-user fa-3x"></i></a>

<div id='contact'>Test!</div>

从弹出窗口读取javascript错误

1 个答案: