隱藏在頁面加載菜單，並需要在超級鏈接

我已經貼上我的代碼的點擊填充上http://jsfiddle.net/2YDPn/隱藏在頁面加載菜單，並需要在超級鏈接

的問題，我面對的是我在一個標籤有一個搜索頁面，結果顯示在搜索的點擊。

但是，當我們點擊結果時，它應該打開詳細結果在一個新的選項卡。

最初我隱藏了標籤的詳細信息。和onlick我重置類和調用div類來顯示內容。但是沒有設置新選項卡的焦點。

請指導我解決這個問題。代碼也粘貼在下面以及

<%@ include file="common-includeCMTT.jsp"%> 

<% 
String language = request.getLocale().toString(); 
ResourceBundle bundle; 

if (session.getAttribute("lang") != null) { 
    language = (String)session.getAttribute("lang"); 
} 
if (language.length()>2){ 
    language=language.substring(0,2); 
} 

Locale locale = new Locale(language); 
session.setAttribute("LocaleObject", locale); 
bundle = ResourceBundle.getBundle("MessageResources", locale); 


String jsFileName = (language.equals("en")) ? "messages.js" : "messages_"+language+".js"; 


%> 
<html> 
<head> 
<link rel="stylesheet" type="text/css" href="compo.css" /> 
<script type="text/javascript" src="js/jquery-1.7.1.js"></script> 
<script type="text/javascript" src="common.js"></script> 
<script type="text/javascript" src="js/jquery.tablesorter.min.js" charset="utf-8"></script> 
<script type="text/javascript" src="js/sortable-tables.js" charset="utf-8"></script> 
<script type="text/javascript" src="js/tabs-2.js"></script> 


<title>Circuit Search Page</title> 

<style type="text/css"> 
.toggle_class 
{ 
display:none; 
} 
</style> 

<script type="text/javascript"> 

      function check(fieldname) 
      { 
      if (/[^0-9A-Z]/gi.test(fieldname.value)) 
      { 
      alert ("Please enter an alphanumeric value"); 
      fieldname.value = ""; 
      fieldname.focus(); 
      return false; 
      } 
      } 

      function valForm(evt) { 
      var form = document.circuitForm; 
      if (form.usid.value != null && form.usid.value != "") { 
      quickSearch('usid', form.usid.value); 
      } 
      else{ 
      alert("Please enter a valid USID"); 
      } 
      } 

     function circuit() { 
      document.getElementById("circuit_reference").style.display = "inline"; 
      document.getElementById("usid").style.display = "none"; 
      document.getElementById("router_name").style.display = "none"; 
      document.getElementById("euclid").style.display = "none"; 
     } 
     function usid1() { 
      document.getElementById("circuit_reference").style.display = "none"; 
      document.getElementById("usid").style.display = "inline"; 
      document.getElementById("router_name").style.display = "none"; 
      document.getElementById("euclid").style.display = "none"; 
     } 
     function router() { 
      document.getElementById("circuit_reference").style.display = "none"; 
      document.getElementById("usid").style.display = "none"; 
      document.getElementById("router_name").style.display = "inline"; 
      document.getElementById("euclid").style.display = "none"; 
     } 
     function euclid1() { 
      document.getElementById("circuit_reference").style.display = "none"; 
      document.getElementById("usid").style.display = "none"; 
      document.getElementById("router_name").style.display = "none"; 
      document.getElementById("euclid").style.display = "inline"; 
     } 

function popupDetailsEvent(submitEvent,value) 
{ 
    var url="circuitDetailsMain.do?event_type="+submitEvent+"&euclid="+value; 
    var title="CIRCUIT_DETAILS"; 
    var submittedEvent = 'CIRCUIT_DETAILS_EVENT'; 
    if(submitEvent == submittedEvent) 
     { 
    var newWindow = window.open(url, title, 'scrollbars=yes,resizable=yes, width=1000,height=700 '); 
    if (window.focus) { newWindow.focus(); } 
     //return false; 
    } 
} 

function displayDetails(link) 
{ 
    alert("hasgdhas"); 

    //window.open(link,'_self'); 
    document.getElementById("tab1").className = ""; 
    document.getElementById("tab1").className = "tabpanel-tabbar-item"; 
    document.getElementById("tab2").className = ""; 
    document.getElementById("tab2").className = "tabpanel-tabbar-item tab_active"; 
    //$('#content01').hide(); 
    $('#content02').show(); 
    //document.getElementById("content01").style.display="none"; 
    // document.getElementById("content02").style.display="block"; 
    // alert("tab1::::::::::"+document.getElementById("tab1").className); 
    // alert("tab2::::::::::"+document.getElementById("tab2").className); 

} 

</script> 
<body class="COMPO"> 

    <html:form method="POST" action="circuitSearchMain"> 

    <div id="tabpanel-demo" class="tab_panel_2 clear"> 
     <ul id="tabpanel-liste" class="tab_menu clear"> 
            <li id="tab1" class="tabpanel-tabbar-item tab_active"><a href="#content01" class="tabpanel-tabbar-link">Search</a></li> 
           <li id="tab2" class="tabpanel-tabbar-item toggle_class"><a href="#content02" class="tabpanel-tabbar-link">Details</a></li> 
           </ul> 
     <div id="content01" class="tab_panel_content_2 " style="height: 450px; width: 990px;"> 

      <center> 
      <br> 
      <h2 class="title_n1_orange">Circuit Search</h2> 
    <ul> 
    <li>Please enter one of the search parameters.</li> 
     </ul> 
       <br> <input name="radioButton" type="radio" 
       value="Circuit_Reference" onclick="circuit();" /> Circuit Reference 
      <input id="circuit_reference" onblur="check(this)" type="text" name="cctRef" 
       style="display: none" /><span style="margin-right: 50px;"></span> <input 
       name="radioButton" type="radio" value="USID" onclick="usid1();" /> 
      USID <input id="usid" onblur="check(this)" type="text" name="usid" style="display: none" /><span 
       style="margin-right: 50px;"></span> <input name="radioButton" 
       type="radio" value="Router_Name" onclick="router();" /> Router Name 
      <input id="router_name" onblur="check(this)" type="text" name="routerName" 
       style="display: none" /><span style="margin-right: 50px;"></span> <input 
       name="radioButton" type="radio" value="Backbone_cct_reference" 
       onclick="euclid1();" /> Backbone Circuit Reference <input 
       id="euclid" onblur="check(this)" type="text" name="backboneCctRef" style="display: none" /> 
      <br> <br> 

      <button type="button" class="button_action_large" title='Search' 
       onclick="javascript:valForm('SEARCH_EVENT');"> 
       <span>Search</span> 
      </button> 
      &nbsp;&nbsp;&nbsp;&nbsp; 
      <button type="button" class="button_action_large" title='Reset' 
       onclick="submitEvent('RESET_EVENT');"> 
       <span>Reset</span> 
      </button> 
      &nbsp;&nbsp;&nbsp;&nbsp; <br> <br> 


<logic:present name="circuitForm" property="circuitInfo"> 

<table class="sortable" id="id_unique" summary="Tables title" border="1" cellpadding="0" cellspacing="0"> 
<thead> 
<tr > 
<th scope="col" class="table_header first" abbr="EUCLID column (unsorted)"><a href="#">EUCLID</a></th> 
<th scope="col" class="table_header" abbr="USID column (unsorted)"><a href="#">USID</a></th> 
<th scope="col" class="table_header" abbr="ROUTER NAME column (unsorted)"><a href="#">ROUTER NAME</a></th> 
<th scope="col" class="table_header" abbr="CIRCUIT ID column (unsorted)"><a href="#">CIRCUIT ID</a></th> 
<th scope="col" class="table_header" abbr="CUSTOMER NAME column (unsorted)"><a href="#">CUSTOMER NAME</a></th> 
<th scope="col" class="table_header" abbr="CUSTOMER CODE column (unsorted)"><a href="#">CUSTOMER CODE</a></th> 
<th scope="col" class="table_header" abbr="CUSTOMER STATUS column (unsorted)"><a href="#">CUSTOMER STATUS</a></th> 
<th scope="col" class="table_header" abbr="COUNTRY column (unsorted)"><a href="#">COUNTRY</a></th> 
</tr> 
</thead> 
<tbody> 
<logic:iterate id="result" name="circuitForm" property="circuitInfo" type="com.equant.cmt.domain.business.Circuit"> 

<tr> 
<%if(result.getEuclid()!=null && !result.getEuclid().equals("")){%> 
<td class="quantity_data"><a href="#" onclick="displayDetails();"><bean:write name="result" property="euclid"/></a></td> 
<%}else{%> 
<td class="quantity_data">&nbsp;</td> 
<%}%> 
<%if(result.getUsid()!=null && !result.getUsid().equals("")){%> 
<td class="quantity_data"><bean:write name="result" property="usid"/></td> 
<%}else{%> 
<td class="quantity_data">&nbsp;</td> 
<%}%> 
<%if(result.getRouterName()!=null && !result.getRouterName().equals("")){%> 
<td class="quantity_data"><bean:write name="result" property="routerName"/></td> 
<%}else{%> 
<td class="quantity_data">&nbsp;</td> 
<%}%> 
<%if(result.getCircuitId()!=null && !result.getCircuitId().equals("")){%> 
<td class="quantity_data"><bean:write name="result" property="circuitId"/></td> 
<%}else{%> 
<td class="quantity_data">&nbsp;</td> 
<%}%> 
<%if(result.getCountryName()!=null && !result.getCountryName().equals("")){%> 
<td class="quantity_data"><bean:write name="result" property="customerName"/></td> 
<%}else{%> 
<td class="quantity_data">&nbsp;</td> 
<%}%> 
<%if(result.getCustomerCode()!=null && !result.getCustomerCode().equals("")){%> 
<td class="quantity_data"><bean:write name="result" property="customerCode"/></td> 
<%}else{%> 
<td class="quantity_data">&nbsp;</td> 
<%}%> 
<%if(result.getCustomerStatus()!=null && !result.getCustomerStatus().equals("")){%> 
<td class="quantity_data"><bean:write name="result" property="customerStatus"/></td> 
<%}else{%> 
<td class="quantity_data">&nbsp;</td> 
<%}%> 
<%if(result.getCountryName()!=null && !result.getCountryName().equals("")){%> 
<td class="quantity_data"><bean:write name="result" property="countryName"/></td> 
<%}else{%> 
<td class="quantity_data">&nbsp;</td> 
<%}%> 
</tr> 

</logic:iterate> 
</tbody> 
</table> 
</logic:present>   
</center> 
</div> 

<div id="content02" class="tab_panel_content_2" style="height: 450px; width: 990px;"> 
hgvhjghj 
</div> 
</div> 

</html:form> 




</body> 
</html>

來源

2013-10-15 Priya

以下是一些代碼片段，可能會幫助您指出正確的方向。

HTML

<div id=content02 style=display:none> 
hgvhjghj 
</div> 

<a href=# onclick=showDetails()>Details</a>

的JavaScript

function showDetails() 
{ 
var content=$('#content02').html(); 
var newtab=window.open(); 
var newdoc=newtab.document; 
newdoc.write(content); 
newdoc.close(); 
}

來源

2013-10-15 04:55:44 chiliNUT

感謝您的答覆。必須在div中填充一個jsp文件。 – Priya

隱藏在頁面加載菜單，並需要在超級鏈接

回答

相關問題