2012-06-16 71 views
0

this question包括使用HTML網頁頁面時jQuery的不工作包括:

參考我們有一個日期頭拾取組件(jQuery和CSS)。當單獨存在標題時,日期選擇器可以正常工作。當我嘗試使用此標題將另一個頁面包含爲主體時,日期選擇器不起作用。

我們使用this link

提到當我們有另一個頁面上面提到的代碼的日期選擇器,日期挑不工作。

包括我使用的命令。 <%@ include file="enterClarity.jsp" %> 有一些表單驗證Java腳本,這是目前在enterCalrity.jsp頁

編輯:

單獨

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<link rel="stylesheet" href="../css/calendar.css" type="text/css" /> 
<link rel="stylesheet" href="../css/datepicker_comp_1.css" type="text/css"/> 
<link rel="stylesheet" href="../css/datepicker_comp_2.css" type="text/css"/> 
<script type="text/javascript" src="../js/datepickr.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> 
<script type="text/javascript" charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script> 
<script type="text/javascript" charset="utf-8"> 
jQuery(function(){ 
    jQuery("#datepicker").datepicker(); 
}); 
</script> 
<title>Clarity</title> 
</head> 

<body> 

<form id="clarityaction" name="tstest" onsubmit="return true;" action="/metrix/clarityaction.action" method="post"><table class="wwFormTable"> 
     <table width="100%" border="0" style="height: 616px; width: 1260px;" 
      cellpadding="0" cellspacing="0"> 
      <tr class="header"> 
       <td align="right" valign="bottom"> 
       <B>Welcome Karthik Prabhu D </B> 
       </td> 
      </tr> 
      <tr class="header"> 
       <td align="right" valign="top">your last login was : 2012-06-16 15:33:51.0 
       </td> 
      </tr> 
      <tr align="left" valign="bottom"><td> 
      <input type="text" id="datepicker" class="haspicker" /></td></tr> 



      <tr> 
       <td bgcolor="#FFFFFF" height="70%" width="100%"> 
        <table width="60%" border="0" style="height: 430px; width: 1206px;" 
         cellpadding="0" cellspacing="0"> 
         <tr> 
          <td> 
           <table border="0" cellpadding="0" cellspacing="0"> 
            <tr> 
             <td> 
              <table border="0"style="vertical-align: top" cellpadding="0" cellspacing="0"> 

               <tr> 
                <td> 

                </td> 
               </tr> 
              </table></td> 
             <td></td> 
             <td></td> 
            </tr> 
           </table> 
          </td> 

         </tr> 
        </table></td> 
      </tr> 

      <tr> 

       <td class="footer"></td> 
      </tr> 

     </table> 


    </table></form> 





</body> 

</html> 

頭包含頁面後:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<link rel="stylesheet" href="../css/calendar.css" type="text/css" /> 
<link rel="stylesheet" href="../css/datepicker_comp_1.css" type="text/css"/> 
<link rel="stylesheet" href="../css/datepicker_comp_2.css" type="text/css"/> 
<script type="text/javascript" src="../js/datepickr.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> 
<script type="text/javascript" charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script> 
<script type="text/javascript" charset="utf-8"> 
jQuery(function(){ 
    jQuery("#datepicker").datepicker(); 
}); 
</script> 
<title>Clarity</title> 
</head> 

<body> 

<form id="clarityaction" name="tstest" onsubmit="return true;" action="/metrix/clarityaction.action" method="post"><table class="wwFormTable"> 
     <table width="100%" border="0" style="height: 616px; width: 1260px;" 
      cellpadding="0" cellspacing="0"> 
      <tr class="header"> 
       <td align="right" valign="bottom"> 
       <B>Welcome Karthik Prabhu D </B> 
       </td> 
      </tr> 
      <tr class="header"> 
       <td align="right" valign="top">your last login was : 2012-06-16 15:36:10.0 
       </td> 
      </tr> 
      <tr align="left" valign="bottom"><td> 
      <input type="text" id="datepicker" class="haspicker" /></td></tr> 



      <tr> 
       <td bgcolor="#FFFFFF" height="70%" width="100%"> 
        <table width="60%" border="0" style="height: 430px; width: 1206px;" 
         cellpadding="0" cellspacing="0"> 
         <tr> 
          <td> 
           <table border="0" cellpadding="0" cellspacing="0"> 
            <tr> 
             <td> 
              <table border="0"style="vertical-align: top" cellpadding="0" cellspacing="0"> 

               <tr> 
                <td> 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<script type="text/javascript" src="../js/tabing.js"></script> 
<script type="text/javascript" src="../js/tabjs.js"></script> 
<script type="text/javascript" src="../js/validaionjs.js"></script> 
<link rel="stylesheet" href="../css/tabStyle.css" type="text/css" /> 
</head> 
<body> 

<-- Other page contents -->   

</body> 

</html> 
+1

你可以給最終的HTML出現?也許jsp文件中的某些js會導致錯誤。 – avk

+0

_header與選取的日期_請解釋? – Baz1nga

+0

也請出示你的代碼,最好我已經編輯後生成的標記 – Baz1nga

回答

0

根據你發佈的代碼,第二個完整的html文件被注入到另一個。你有一個HTML頁面在另一個...絕對不好;)

!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
     "http://www.w3.org/TR/html4/loose.dtd"> 

    <html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <link rel="stylesheet" href="../css/calendar.css" type="text/css" /> 
    <link rel="stylesheet" href="../css/datepicker_comp_1.css" type="text/css"/> 
    <link rel="stylesheet" href="../css/datepicker_comp_2.css" type="text/css"/> 
    <script type="text/javascript" src="../js/datepickr.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> 
    <script type="text/javascript" charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script> 
    <script type="text/javascript" charset="utf-8"> 
    jQuery(function(){ 
     jQuery("#datepicker").datepicker(); 
    }); 
    </script> 
    <title>Clarity</title> 
    </head> 

    <body> 

    <form id="clarityaction" name="tstest" onsubmit="return true;" action="/metrix/clarityaction.action" method="post"><table class="wwFormTable"> 
      <table width="100%" border="0" style="height: 616px; width: 1260px;" 
       cellpadding="0" cellspacing="0"> 
[...]  
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 

    <html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <script type="text/javascript" src="../js/tabing.js"></script> 
    <script type="text/javascript" src="../js/tabjs.js"></script> 
    <script type="text/javascript" src="../js/validaionjs.js"></script> 
    <link rel="stylesheet" href="../css/tabStyle.css" type="text/css" /> 
    </head> 
    <body> 

    <-- Other page contents -->  
+0

我已經使用了一個頁面包含。因此它是如此。我需要添加正文頁面的頁面頁面。除了我所做的之外,還有其他的方式嗎? – om39a

+1

您應該使用包含來包含通常在不同頁面之間共享的標記的*部分*。您必須僅包含所需的標記,而不在您的容器頁面中存在標記元素。 – mamoo

+2

問題是您的正文頁面正在添加到標題HTML標記之後。您需要去除正文頁面的重複標籤並將其插入正文中。 – Jason