首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Ajax >

跪求!关于Ajax引用js效果的有关问题

2012-08-30 
跪求!:关于Ajax引用js效果的问题引用网上一段js效果的代码,静态数据可以出发效果,但是用ajax从数据库动态

跪求!:关于Ajax引用js效果的问题
引用网上一段js效果的代码,静态数据可以出发效果,但是用ajax从数据库动态生成带样式,带结构的html代码块,就没有js的效果了。。跪求解决方法。
以下是静态代码html
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="home.aspx.cs" Inherits="Svr_home_home" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
  <title></title>  
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <link href="../ui/css/reset.css" rel="stylesheet" type="text/css" />  
  <link href="../ui/css/style.css" rel="stylesheet" type="text/css" />
  <link href="../ui/css/invalid.css" rel="stylesheet" type="text/css" />
  <!--菜单信息 注意顺序 -->
  <script src="../ui/scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
  <script src="../ui/scripts/simpla.jquery.configuration.js" type="text/javascript"></script>
  <script src="../ui/scripts/facebox.js" type="text/javascript"></script>
  <script src="../ui/scripts/jquery.wysiwyg.js" type="text/javascript"></script>  
<%-- <script src="../ui/scripts/jquery.datePicker.js" type="text/javascript"></script>
  <script src="../ui/scripts/jquery.date.js" type="text/javascript"></script> --%>
  <script language="javascript" type="text/jscript"></script>  
  <style type="text/css"></style>
</head>
<body>
  <form id="form1" runat="server">
   
  <div id="body-wrapper"> <!-- Wrapper for the radial gradient background -->

<div id="sidebar"><div id="sidebar-wrapper"> <!-- Sidebar with logo and menu -->

<h1 id="sidebar-title"><a href="#">Simpla Admin</a></h1>
  
<!-- Logo (221px wide) -->
<a href="#"><img id="logo" src="../ui/images/logo.png" alt="Simpla Admin logo" /></a>
  
<!-- Sidebar Profile links -->
<div id="profile-links">
Hello, <a href="#" title="Edit your profile">John Doe</a>, you have <a href="#messages" rel="modal" title="3 Messages">3 Messages</a><br />
<br />
<a href="#" title="View the Site">View the Site</a> | <a href="#" title="Sign Out">Sign Out</a>
</div>  
  <ul id="main-nav">
  <li><a href="#" class="nav-top-item">CRM管理</a><ul><li><a href=../user/department.aspx onclick="javascript:click_menu('20090508092820890507490891272286')" target="Yuetion" >记录状态信息列表</a></li><li><a href=../crm/enterprise-list.aspx onclick="javascript:click_menu('20090508101011937813744125462467')" target="Yuetion" >公司列表</a></li><li><a href=../crm/contact-list.aspx onclick="javascript:click_menu('20090508133933343452706678041417')" target="Yuetion" >联系人列表</a></li><li><a href=../crm/project-list.aspx onclick="javascript:click_menu('20090508151556078475703289206421')" target="Yuetion" >项目列表</a></li><li><a href=../crm/projectstatus.aspx onclick="javascript:click_menu('20090512095359703991090156608600')" target="Yuetion" >项目状态管理</a></li></ul></li><li><a href="#" class="nav-top-item">HR管理</a><ul><li><a href=../user/department.aspx onclick="javascript:click_menu('20090508092557203945559935506523')" target="Yuetion" >人事管理</a></li><li><a href=../user/adminuser-list.aspx onclick="javascript:click_menu('20090506180509578923024107555515')" target="Yuetion" >管理员列表</a></li><li><a href=../grade/skillgrade.aspx onclick="javascript:click_menu('20090506182602593456572809070658')" target="Yuetion" >技术等级管理</a></li><li><a href=../grade/vouchergrade.aspx onclick="javascript:click_menu('20090506183534781233075399587144')" target="Yuetion" >证书认证管理</a></li><li><a href=../user/profession.aspx onclick="javascript:click_menu('20090507105047750545881009640820')" target="Yuetion" >行业分划管理</a></li><li><a href=../user/department.aspx onclick="javascript:click_menu('20090507151349531134622930896944')" target="Yuetion" >部门管理</a></li></ul></li><li><a href="#" class="nav-top-item">TAC管理</a><ul><li><a href=../user/department.aspx onclick="javascript:click_menu('20090508092755593842349508249267')" target="Yuetion" >售后服务</a></li></ul></li><li><a href="#" class="nav-top-item">系统设置</a><ul><li><a href=../menu/role.aspx onclick="javascript:click_menu('20090430153927687143101153368257')" target="Yuetion" >角色管理</a></li><li><a href=../menu/admin.aspx onclick="javascript:click_menu('20090430153945187493950574930923')" target="Yuetion" >菜单管理</a></li></ul></li> </ul> 


</div>
  </div> <!-- End #sidebar --> 
<!-- End #main-content --> 
  <div id="main-content">
  <iframe height="640px" width="100%" name="Yuetion" frameborder="0" src="index.aspx" >
  </iframe>
  </div>
</div>
  </form>
  <script src="../master/menu.js" type="text/javascript"></script>
</body>
</html>


上面几个js是引用的动画效果
红色代码块是ajax生成的结构数据(如果用静态直接贴上去是有效果的,但是用ajax生成就没效果,右键查看网页源码却惊奇的发现这块代码完全没有,但是页面却能显示这些数据)。
绿色那段引用是调用ajax的js页面。

请帮帮忙,如果有谁需要这个动画效果的话留邮箱我发他,大家一起研究!!!

[解决办法]
zell419#hotmail.com
看看 。
把绿色引用的js文件放上面去看看行不 。
[解决办法]
大概看了下,应该是加载内容的问题,你将$(document).ready里面的添加事件的代码做成一个函数中,在ajax回调的时候再绑定事件,$(document).ready这个可以不需要了。

JScript code
function getReadyMenu()    {        if(xmlhttp_menu==null)            return;                    if(xmlhttp_menu.readyState == 4)        {            if(xmlhttp_menu.status == 200)            {                document.getElementById('main-nav').innerHTML = xmlhttp_menu.responseText;bindEvent();//===========重新绑定事件            }            xmlhttp_menu = null;        }    }function bindEvent(){//Sidebar Accordion Menu:                $("#main-nav li ul").hide(); // Hide all sub menus        $("#main-nav li a.current").parent().find("ul").slideToggle("slow"); // Slide down the current menu item's sub menu                $("#main-nav li a.nav-top-item").click( // When a top menu item is clicked...            function () {                $(this).parent().siblings().find("ul").slideUp("normal"); // Slide up all sub menus except the one clicked                $(this).next().slideToggle("normal"); // Slide down the clicked sub menu                return false;            }        );                $("#main-nav li a.no-submenu").click( // When a menu item with no sub menu is clicked...            function () {                window.location.href=(this.href); // Just open the link instead of a sub menu                return false;            }        );     // Sidebar Accordion Menu Hover Effect:                $("#main-nav li .nav-top-item").hover(            function () {                $(this).stop().animate({ paddingRight: "25px" }, 200);            },             function () {                $(this).stop().animate({ paddingRight: "15px" });            }        );    //Minimize Content Box                $(".content-box-header h3").css({ "cursor":"s-resize" }); // Give the h3 in Content Box Header a different cursor        $(".closed-box .content-box-content").hide(); // Hide the content of the header if it has the class "closed"        $(".closed-box .content-box-tabs").hide(); // Hide the tabs in the header if it has the class "closed"                $(".content-box-header h3").click( // When the h3 is clicked...            function () {              $(this).parent().next().toggle(); // Toggle the Content Box              $(this).parent().parent().toggleClass("closed-box"); // Toggle the class "closed-box" on the content box              $(this).parent().find(".content-box-tabs").toggle(); // Toggle the tabs            }        );    // Content box tabs:                $('.content-box .content-box-content div.tab-content').hide(); // Hide the content divs        $('ul.content-box-tabs li a.default-tab').addClass('current'); // Add the class "current" to the default tab        $('.content-box-content div.default-tab').show(); // Show the div with class "default-tab"                $('.content-box ul.content-box-tabs li a').click( // When a tab is clicked...            function() {                 $(this).parent().siblings().find("a").removeClass('current'); // Remove "current" class from all tabs                $(this).addClass('current'); // Add class "current" to clicked tab                var currentTab = $(this).attr('href'); // Set variable "currentTab" to the value of href of clicked tab                $(currentTab).siblings().hide(); // Hide all content divs                $(currentTab).show(); // Show the content div with the id equal to the id of clicked tab                return false;             }        );    //Close button:                $(".close").click(            function () {                $(this).parent().fadeTo(400, 0, function () { // Links with the class "close" will close parent                    $(this).slideUp(400);                });                return false;            }        );    // Alternating table rows:                $('tbody tr:even').addClass("alt-row"); // Add class "alt-row" to even table rows    // Check all checkboxes when the one in a table head is checked:                $('.check-all').click(            function(){                $(this).parent().parent().parent().parent().find("input[type='checkbox']").attr('checked', $(this).is(':checked'));               }        );    // Initialise Facebox Modal window:                $('a[rel*=modal]').facebox(); // Applies modal window to any link with attribute rel="modal"    // Initialise jQuery WYSIWYG:                $(".wysiwyg").wysiwyg(); // Applies WYSIWYG editor to any textarea with the class "wysiwyg"} 


[解决办法]

探讨
引用网上一段js效果的代码,静态数据可以出发效果,但是用ajax从数据库动态生成带样式,带结构的html代码块,就没有js的效果了。。跪求解决方法。
以下是静态代码html
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="home.aspx.cs" Inherits="Svr_home_home" %>

<!DOCTYPE ……

热点排行