jquery - jquery 滑块在母版页 asp.net 上不起作用

Question

  $(document).ready(function () {

          $("div#banner_content").jContent({ orientation: 'vertical',
            easing: "easeOutCirc",
            duration: 500,
            auto: true,
            pause_on_hover: true,
            direction: 'next'
        });

    });

它在另一个不使用母版页的页面上工作正常

  <div id="banner_content">
            <big runat="server" id="slides1"></big>
        </div>

我正在从 c# 后端添加我的内容

当我在 firebug 中调试时，我在错误控制台中收到此错误，因为我的 MasterPage 上没有此类元素

注意：我所有的脚本都可以正常工作，因为我已经在另一个页面上测试了代码

Answer 1

当您使用母版页时，id 会发生变化。因此，如果您使用的是 asp.net 4.0，您可以使用

ClientIDMode="Static" 

如下

 <div id="banner_content" ClientIDMode="Static" >
        <big runat="server" id="slides1"></big>
    </div>

或在您的 jquery 代码中

   $(document).ready(function () {
      $("div#<%= banner_content.ClientID %>").jContent({ orientation: 'vertical',
        easing: "easeOutCirc",
        duration: 500,
        auto: true,
        pause_on_hover: true,
        direction: 'next'
    });

});

Answer 2

根据您的描述，可能存在2个问题。CSS 错误看起来可能来自身份验证问题，并被重定向到登录页面。就我从你输入的屏幕截图中可以看出的。

另一个错误，可能是因为您尝试访问的元素的 id 是在服务器端创建的。因此，您可以在 javascript 代码中执行以下操作：

$(document).ready(function () {

      $("div#<%=banner_content.ClientID%>").jContent({ orientation: 'vertical',
        easing: "easeOutCirc",
        duration: 500,
        auto: true,
        pause_on_hover: true,
        direction: 'next'
    });

});

或者您可以通过在母版页、页面或单个控件中定义 ClientIDMode 来使用静态 ID：

ClientIDMode="Static"