CODEWITHSUNDEEP
javascriptjquery
Juan Chandler
Juan Chandler

Reputation: 131

Need jquery to activate a click through by clicking on a different div

I was hoping someone could help...I'm new to Jquery ....all I want to achieve is a click through on a hyperlinked image but this occurs when a completely separate div on another part of the page is clicked on rather than the hyperlinked image I just mentioned. .......the hyperlinked image needs to be invisible also. In case anyone is wondering why I need this ....it's because I want my own custom button rather than the standard one that comes with a CMS that I'm using and it can't be changed....it's basically a work around the owners of the system suggest.

Here's what I thought would work

<style>

  #my-custom-button{
     margin: 0 auto;
     width: 200px     
   }


  #the-standard-button{
     display : none
   }    

</style>


<div id="my-custom-button">
    <a href="#"><img src="../images/order-now.png"></a>
</div>

 <div id="the-standard-button"> 
     <?php
         proprietary PHP here that renders the standard button
     ?>
 </div>


 <script type="text/javascript">
  <!--
    $(function(){
       $("#my-custom-button").click(function(){
         $("#the-standard-button").click();
       });
    });
  -->
 </script>

Upvotes: 0

Views: 60

Answers (2)

Andrew Steitz
Andrew Steitz

Reputation: 2007

The whole

<?php propiertary blah blah ?>

makes it hard to decipher but my guess is that the handler is being generated for whatever is being created by php, i.e. the php generates

<button id="phpButton">
    blah
</button>

and then a handler like

$("#phpButton").click(....)

Notice that the handler is NOT on "#the-standard-button". So, you need make sure that you are using the correct selector when calling the click() in $("#my-custom-button").click(...)

Check out this jsFiddle. Notice which secondary click event is fired.

Upvotes: 1

trve.fahad
trve.fahad

Reputation: 4496

I'm not sure I understand your question perfectly, if what you want is that when You click on one button it will act as though the other was clicked.

Here is a solution that will work IF the default button is also an anchor tag (<a>)

HTML:

<div id="newButton">
<a href="#"><img src="/theimage.jpg"/></a>
</div>

<div id="oldDiv">
<a href="whatever.com"><img src"oldImage.png"/></a>
</div>

JQuery:

jQuery(document).ready(function($){
    $("#oldDiv").hide();
    $("#newDiv > a").click(function(){
        window.location = $("#oldDiv>a").attr("href");
    });
});

Upvotes: 0

Related Questions