Skip to content Skip to sidebar Skip to footer

Script Works On Jsfiddle But Not In My Webpage Jquery

With help from @Joseph I have managed to create this script that works exactly the way I want it to on jsfiddle. However, when I use the exact same script on my webpage it does no

Solution 1:

You are including jQuery twice. One is the minified version, denoted by the min.js. You only need one of those libraries. I suggest using the minified version to save bandwidth.


Solution 2:

This seems like an error in your HTML, because it works here locally when creating the HTML from scratch.

You can also try to debug your version with Firebug or the debuggers of Safari or Chrome. Put a breakpoint in your code, and trying out the jQuery selectors manually in the console can help to spot most problems.

This one works:

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ()
{
    $("input[type='radio']").click(function(){
    var $knapp = $(this).val();      

    if(($knapp=='1c') || ($knapp=='2c')|| ($knapp=='3c')) {
        this.checked = true;  
    }else{
        $("input[type='radio']."+this.className).not($(this)).each(function(){
            this.checked = false;
        });
    }
});
});

</script>
</head>

<body>

<table>   
<tr> 
<td>1</td> 
<td><input type="radio" class="ljudkalla_1" name="ljudkalla_1" value="1a"></td> 
<td><input type="radio" class="ljudkalla_2" name="ljudkalla_1" value="1b"></td> 
<td><input type="radio" class="ljudkalla_3" name="ljudkalla_1" value="1c"></td> 
</tr>
<tr> 
<td>2</td> 
<td><input type="radio" class="ljudkalla_1" name="ljudkalla_2" value="2a"></td> 
<td><input type="radio" class="ljudkalla_2" name="ljudkalla_2" value="2b"></td> 
<td><input type="radio" class="ljudkalla_3" name="ljudkalla_2" value="2c"></td> 
</tr>
<tr> 
<td>3</td> 
<td><input type="radio" class="ljudkalla_1" name="ljudkalla_3" value="3a"></td> 
<td><input type="radio" class="ljudkalla_2" name="ljudkalla_3" value="3b"></td> 
<td><input type="radio" class="ljudkalla_3" name="ljudkalla_3" value="3c"></td> 
</tr>
</table>

</body>
</html>

Solution 3:

I think this is what you are after, correct? Does this work on your local machine?

$("input").click(function() {
    if (this.className.indexOf('3') === -1) {
        $("input." + this.className).not($(this)).each(function() {
            this.checked = false;
        });
    }
});

Post a Comment for "Script Works On Jsfiddle But Not In My Webpage Jquery"