使用JavaScript来根据<select>内容使用JavaScript修改页面

所以，我已经有了一个表单，并且在该表单中是一个<select>。根据选择的内容（选择什么<option>），我希望表单的内容随时更改（即在用户单击其他任何内容之前）。使用JavaScript来根据<select>内容使用JavaScript修改页面

例如，如果用户选择Photo Upload选项，将出现一个文件上载框，如果他们选择Text Entry，则会出现一个文本框来代替该文件上载框。

谢谢。

来源

2009-12-07 fishman

function swapDiv(index) { 
    var html = ''; 
    switch(index) { 
     ... // assign html var based on index; 
    } 
    div.innerHTML = html; // assign div html to html var 
} 
select.onchange = function() { 
    swapDiv(this.selectedIndex); 
}

来源

2009-12-07 02:40:54

对不起，对JavaScript完全无能为力，但我无法得到这个工作。整个HTML文档会是什么样子？太感谢了。 – fishman 2009-12-07 02:47:38

使用onchange事件触发文件上传（或其他）。

来源

2009-12-07 02:40:24 jldupont

是的，我知道我应该使用'onchange'事件，我只是不知道如何使JS功能做我想要的。 – fishman 2009-12-07 02:41:28

这个使用jQuery：

$(function() 
{ 
    var shown = $($('#my-select').val()); 

    $('#my-select').change(function() 
    { 
     shown.hide(); 
     shown = this.form.find($(this).val()).show(); 
    }); 
});

预计这样的html：

<style> 
textarea, input { display: none; } 
</style> 
<form id="my-form"> 
    <textarea id="text-entry"></textarea> 
    <input type="file" id="file-upload"> 
    <select id="my-select"> 
    <option value="#text-entry">Text Entry</option> 
    <option value="#file-upload">File Upload</option> 
    </select> 
</form>

来源

2009-12-07 03:05:00

使用JavaScript来根据<select>内容使用JavaScript修改页面

回答

相关问题