現在のページのメニュー項目をjavascriptで更新する

私はこれを別の方法で聞かせてください：URLに基づいて、私はメインメニューで使用されているイメージを更新したいと思います。現在のページのメニュー項目をjavascriptで更新する

私は

urlPath = document.location.href; 

<td> 

<script type="text/javascript"> 


if (urlPath=="mydomain.com/home/") 
    { 
    document.write("<img src='current_page.jpg'/>"); 
    }else{ 
document.write("<img src='image/normal_button.jpg'/>"); 
} 
</script> 
</td>

（私のJavaScriptががらくたである）次の操作を実行しようとしていますし、私はすべてのメニュー項目のためにそれを行うことができます。それがうまくいくのでしょうか、それとももっと良い方法がありますか？

以下は私が最終的に更新する必要がある私の現在のコードです。

<body onload="MM_preloadImages('/storage/images/nav_products_over.png','/storage/images/nav_about_over.png','/storage/images/nav_school_over.png','/storage/images/nav_blog_over.png','/storage/images/nav_wholesale_over.png','/storage/images/nav_gifts_over.png','/storage/images/nav_catering_over.png','/storage/images/nav_menus_over.png','/storage/images/nav_press_over.png','/storage/images/nav_contact_over.png')"> 
<table width="800" border="0" align="center"> 
    <tr> 
    <td width="36%"><a href="/"><img src="/storage/images/logo.png" alt="" width="206" height="113" /></a></td> 
    <td width="64%"><table width="100%" border="0" cellpadding="0" cellspacing="0"> 
     <tr> 
     <td><a href="/products/" target="_top" onclick="MM_nbGroup('down','group1','Products','/storage/images/nav_products_over.png',1)" onmouseover="MM_nbGroup('over','Products','/storage/images/nav_products_over.png','',1)" onmouseout="MM_nbGroup('out')"><img src="/storage/images/nav_products.png" alt="" name="Products" border="0" id="Products2" onload="" /></a></td> 
     <td><a href="/about/" target="_top" onclick="MM_nbGroup('down','group1','About','',1)" onmouseover="MM_nbGroup('over','About','/storage/images/nav_about_over.png','',1)" onmouseout="MM_nbGroup('out')"><img src="/storage/images/nav_about.png" alt="" name="About" width="72" height="26" border="0" id="About2" onload="" /></a></td> 
     <td><a href="/school-of-fish/" target="_top" onclick="MM_nbGroup('down','group1','School','',1)" onmouseover="MM_nbGroup('over','School','/storage/images/nav_school_over.png','',1)" onmouseout="MM_nbGroup('out')"><img src="/storage/images/nav_school.png" alt="" name="School" width="155" height="26" border="0" id="School2" onload="" /></a></td> 
     <td><a href="/blog/" target="_top" onclick="MM_nbGroup('down','group1','Blog','',1)" onmouseover="MM_nbGroup('over','Blog','/storage/images/nav_blog_over.png','',1)" onmouseout="MM_nbGroup('out')"><img src="/storage/images/nav_blog.png" alt="" name="Blog" width="55" height="25" border="0" id="Blog2" onload="" /></a></td> 
     </tr> 
    </table> 
     <table width="100%" border="0"> 
     <tr> 
      <td width="19%" height="30" valign="bottom"><a href="/wholesale/" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('wholesale','','/storage/images/nav_wholesale_over.png',1)"><img src="/storage/images/nav_wholesale.png" alt="" name="wholesale" width="67" height="14" border="0" id="wholesale" /></a></td> 
      <td width="13%" height="30" valign="bottom"><a href="http://ws2519-2640.staging.nitrosell.com/store/product/1707/Gift-Card-%2450/" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Gifts','','/storage/images/nav_gifts_over.png',1)"><img src="/storage/images/nav_gifts.png" alt="" name="Gifts" width="34" height="14" border="0" id="Gifts" /></a></td> 
      <td width="17%" height="30" valign="bottom"><a href="/catering/" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('catering','','/storage/images/nav_catering_over.png',1)"><img src="/storage/images/nav_catering.png" alt="" name="catering" width="55" height="14" border="0" id="catering" /></a></td> 
      <td width="12%" height="30" valign="bottom"><a href="/menus/" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('menus','','/storage/images/nav_menus_over.png',1)"><img src="/storage/images/nav_menus.png" alt="" name="menus" width="39" height="14" border="0" id="menus" /></a></td> 
      <td width="22%" height="30" valign="bottom"><a href="/press/" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('press','','/storage/images/nav_press_over.png',1)"><img src="/storage/images/nav_press.png" alt="" name="press" width="73" height="14" border="0" id="press" /></a></td> 
      <td width="17%" height="30" valign="bottom"><a href="/contact-us/" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('contact','','/storage/images/nav_contact_over.png',1)"><img src="/storage/images/nav_contact.png" alt="" name="contact" width="51" height="14" border="0" id="contact" /></a></td> 
     </tr> 
     </table></td> 
    </tr> 
</table>

出典

2011-07-14 Denoteone

皆は私が

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 

     var url = window.location.pathname; 
     //if the variables below find a match they return a -1 
     var tempProducts = url.search(/products/g); 
     var tempAbout = url.search(/about/g); 
     var tempSchool = url.search(/school-of-fish/g); 
     var tempBlog = url.search(/blog/g); 

     if (tempProducts == "1"){//you might have to take the quotes off of the -1 I don't know for sure 
      //$('#Products2').unbind('onmouseover').unbind('onmouseout'); 
      $('#Products2').attr("src","/storage/images/nav_products_over.png"); 
     } 
     if (tempAbout == "1"){ 
      //$('#About2').unbind('onmouseover').unbind('onmouseout'); 
      $('#About2').attr("src","/storage/images/nav_about_over.png"); 
     } 
     if (tempSchool == "1"){ 
      //$('#School2').unbind('onmouseover').unbind('onmouseout'); 
      $('#School2').attr("src","/storage/images/nav_school_over.png"); 
     } 
     if (tempBlog == "1"){ 
      //$('#Blog2').unbind('onmouseover').unbind('onmouseout'); 
      $('#Blog2').attr("src","/storage/images/nav_blog_over.png"); 
     } 

           }); 
    </script>

jQueryの

を使用して、私の機能を実現どのように見ることができますちょうどそう

出典

2011-07-16 05:17:43 Denoteone

現在のページのメニュー項目をjavascriptで更新する

答えて

関連する問題