so ändern Sie hintergrund-Bild, dynamisch nur wenn radio-button ausgewählt ist und durch drücken der senden-Schaltfläche

Nur mithilfe von Javascript

Test online: http://jsfiddle.net/OscarGarcia/t70prkda/

HTML-test-code:

<form name="form" onsubmit="return check()">
    <p><input type="radio" name="bg" value="no" />
        Desactivate</p>
    <p><input type="radio" name="bg" checked="checked" value="yes" />
        Activate</p>
    <input type="submit" />
</form>

Javascript-code:

function check() {
    if (document.form.bg.value == "yes") {
        document.body.style.background = "red";
    } else {
        document.body.style.background = "";
    }
    return false;
}

Edit 1: Mit Hilfe von jQuery

Test online: http://jsfiddle.net/OscarGarcia/t70prkda/1/

function check() {
    if ($("#form input[name=bg]:checked").val() == "yes") {
        $('body').css('background', "red");
    } else {
        $('body').css('background', "");
    }
    return false;
}

Edit 3: Ändern hintergrund Bild in JS und jQuery

Einfachheit halber mein code nur ändern, hintergrund-Farbe, diese wechselt background-image: http://jsfiddle.net/OscarGarcia/t70prkda/2/

function check() {
    if ($("#form input[name=bg]:checked").val() == "yes") {
        $('body').css('background-image', "url(https://c2.staticflickr.com/8/7151/6717697085_6d28849226_z.jpg)");
    } else {
        $('body').css('background', "");
    }
    return false;
}

Und in reinem javascript: http://jsfiddle.net/OscarGarcia/t70prkda/3/

function check() {
    if (document.form.bg.value == "yes") {
        document.body.style.backgroundImage = "url(https://c2.staticflickr.com/8/7151/6717697085_6d28849226_z.jpg)";
    } else {
        document.body.style.background = "";
    }
    return false;
}

Edit 3: Smooth Hintergrundbild übergang

Online testen: http://jsfiddle.net/OscarGarcia/2g6rfdsf/

CSS-Code:

body {
    height: 100%;
}

#overlay {
    position: absolute;
    top: 0px;
    left: 0px;
    padding: 0px;
    margin:0px;
    width: 100%;
    height: 100%;
    background: red url(http://thumbs.dreamstime.com/z/abstract-blue-tiled-background-5151518.jpg) -400px center;
    transition: all 2s ease-in-out;
    opacity: 0;
    z-index: -1;
}

HTML-Code:

<div id="overlay"></div>
<form name="form" id="form" onsubmit="return check()">
    <p><input type="radio" name="bg" value="no" />
        Fade-out</p>
    <p><input type="radio" name="bg" checked="checked" value="yes" />
        Fade-in</p>
    <input type="submit" />
</form>

Hinweis, dass ich mit einem overlay (ein div über dem hintergrund) mit opacity auf 0 (versteckt) und ich werde animieren Sie die Deckkraft. Es ist nicht möglich animiert hintergrund Bild ändert sich, Sie ändert sich sofort.

Und javascript (jQuery-version) code:

function check() {
    if ($("#form input[name=bg]:checked").val() == "yes") {
        $('#overlay').
            css('opacity', '1').
            css('background-position', '0px center');
    } else {
        $('#overlay').
            css('opacity', '0').
            css('background-position', '-400px center');
    }
    return false;
}

Beim drücken der Taste hintergrund overlay angezeigt oder ausgeblendet reibungslos, denn CSS-code transition: all 2s ease-in-out; während Sie mit der linken position ändert sich langsam auch!.

Hoffe, es hilft!