ajax button click not proper

I am trying ajax for the first time. I have a button in p开发者_StackOverflow社区hp

<input type ="button" name = "save" value = "save"/>

I have the following code

<script language = "javascript" type = "text/javascript" src = "jquery.js">
$(document).ready(function(){$("#save").click(function(){alert("1");})})
</script>

I am just trying to make sure that the alert will be displayed before I write any complex code for implementing ajax call. But the alert is not displayed. What am I missing? Can anyone please point out. Thanks in advance Pre

You just need to have the id set in the element. the # selector will look for the element with as the id.

I have demo'ed this in this jsFiddle

I put in the e.preventDefault(); because that will stop the page from posting...which is probably not what you want to do if you are going to be doing an AJAX post.

First:

The content of a script element is used if the browser doesn't understand the src attribute or if there is no src attribute.

If you want an inline script and an external script, then you need two script elements.

Second:

The selector #save means "An element with the id save". Your input doesn't have an id at all.

Corrected code:

<input type="button" id="save" value="save" />

<script type="text/javascript" src="jquery.js"> </script>
<script type="text/javascript">
$(function(){
  $("#save").click(function(){
    alert("1");
  });
});
</script>

Can you try this:

<input type ="button" name = "save" id="save" value = "save"/>