I am trying to navigate to another page using jquery

Markup :

<input type="image" name="ImageButton1" id="btnCancel" src="../images/btn_cancel.gif" />

JS

 $('input[type="image"][id^="btnCancel"]').live('click', function () {
        window.location.replace('default.aspx');
 });

Page just refreshes, it does not navigate to desired page. when i change type=button it works.

How to achieve the same by keeping type as image only ?

I am trying to navigate to another page using jquery

Markup :

<input type="image" name="ImageButton1" id="btnCancel" src="../images/btn_cancel.gif" />

JS

 $('input[type="image"][id^="btnCancel"]').live('click', function () {
        window.location.replace('default.aspx');
 });

Page just refreshes, it does not navigate to desired page. when i change type=button it works.

How to achieve the same by keeping type as image only ?

• javascript
• jquery
• html

• 2 live is deprecated, use on instead of it – Anoop Joshi P Commented Jun 26, 2014 at 9:13
• Why 2 attribute selectors for a single element? you can only do it with $("#btnCancel"). – Dhaval Marthak Commented Jun 26, 2014 at 9:13
• input type="image" acts like submit. Replace it with type="button" – Arvind Bhardwaj Commented Jun 26, 2014 at 9:13
• @ArvindBhardwaj : i want to keep image only – Shaggy Commented Jun 26, 2014 at 9:14
• If type="button" works, then use it. Since you want to keep the image, style the button in CSS using the image as the background. – afaolek Commented Jun 26, 2014 at 9:17

3 Answers 3

$("#btnCancel").on('click', function () {
        window.location.href = 'default.aspx';
});

Use preventdefault:

$('input#btnCancel').on('click', function (e) {
        e.preventDefault();
        window.location.replace('default.aspx');
 });

Us on instead of live...and prevent default to stop the default behaviour.

  $(document).on('click','input[type="image"][id^="btnCancel"]',function(e){
       e.preventDefault();
       window.location.replace('default.aspx');
  });

live is deprecated