Jquery map function loosing state

This is my below code to retrieve the checkbox values using jquery .

<div id="checkboxdiv">
<input type="checkbox" name="test" value=1 onclick="getVals();" checked/>
<input type="checkbox" name="test" value=2 onclick="getVals();" checked/>
<input type="checkbox" name="test" value=3 onclick="getVals();" checked/>
<input type="checkbox" name="test" value=4 onclick="getVals();" checked/>
</div>

Below is the Jquery script function:

function getVals(){
  var values=$("#checkboxdiv input[name=test]:checked").map (function (){
    return $(this).val();}).get()开发者_如何转开发.join(',');
  alert(values);
}

When i execute above code first time ,it is working fine.When i start uncheck any check box it is giving result like if i uncheck 4th check box ,it is giving result like ,2,3

I dont understand what is the wrong with above code,Any hints appreciated.

Your code works fine if you fix these two problems:

1. Add the missing ")" for the ".map()" call
2. The selector should end with ":checked" not ".checked"

Here is a jsfiddle.