简体   繁体   English

单击单选按钮并显示图像

[英]clicking a radio button and displaying an image

How do I display an image in my context box, when I click a specific radio button? 单击特定的单选按钮时,如何在上下文框中显示图像? How do I manipulate a certain radio button to display an image inside the scene box? 如何操作某个单选按钮以在场景框内显示图像? The radio buttons are made from jquery and javascript, not html. 单选按钮是由jquery和javascript而不是html制成的。 Any solutions or help? 任何解决方案或帮助吗?

function initialize() {
    var initialScene = getScene("scene1");
    displayScene(initialScene);
}

function changeScene(selectedOption) {
    var selectedSceneId = selectedOption.value;
    var selectedScene = getScene(selectedSceneId);
    if (selectedScene == "scene6") {
        $("#content").effect(
            {
                effect: "explode",
                duration: 1000,
                complete: function () {
                }
            });
    }
    else {
        $("#content").effect(
            {
                effect: "fade",
                duration: 1000,
                complete: function () {
                    displayScene(selectedScene);
                    $("#content").effect("fade", 1000);
                }
            });
    }
}


function displayScene(scene) {
    $("#sceneTitle").html(scene.title);
    $("#sceneText").html(scene.text);
    $("#sceneOptions").html(createSceneOptions(scene));
}

function getScene(sceneId) {
    var matchedScenes = $.grep(scenes, function (scene) {
        return scene.id == sceneId;
    });

    return matchedScenes[0];
}

function createSceneOptions(scene) {
    var sceneOptions = "";
    $.each(scene.options, function (index, option) {
        sceneOptions += "<input type=\"radio\" name=\"options\" value=\"" + option.nextSceneId + "\" id=\"" + index + "\" onclick=\"changeScene(this)\"><label for=\"" +  index   +  "\">" + option.text + "</label><br/>";
    });

    return sceneOptions;
}

My radio buttons consist of jquery, so my only html I have for the radio buttons is 我的单选按钮包含jquery,所以我唯一的单选按钮html是

<div id="sceneOptions">

Fiddle: http://jsfiddle.net/QCN8S/1/ 小提琴: http : //jsfiddle.net/QCN8S/1/

You can use the .onclick event for every radio button 您可以为每个单选按钮使用.onclick事件

 <radio onclick="myfun(url-to-image )" />

jQuery: jQuery的:

function myfun(var i) {
    $(#sceneoption).css("background-image", "URl(i)");
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM