Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/flash/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 动态下拉列表_Javascript - Fatal编程技术网

Javascript 动态下拉列表

Javascript 动态下拉列表,javascript,Javascript,我的网站上有两个下拉列表。我想通过使用JavaScript的“onChange()”fn根据我们在另一个dropbox上选择的值来更改一个下拉列表的选项数和选项值。例如 /第一个下拉列表/ 选择 英语 泰米尔人 泰卢固 卡纳达 马来亚拉姆 乌尔都语 旁遮普 /第二个下拉列表,其选项和值的数量将根据更改上述下拉列表的值//进行更改/ 印度快车 印度教徒报 有线电视新闻网国际广播公司 NDTV 我与它斗争了很长一段时间,即使这可以通过php完成,请为我提供一个解决方案 试试这个 HTML 这

我的网站上有两个下拉列表。我想通过使用JavaScript的“onChange()”fn根据我们在另一个dropbox上选择的值来更改一个下拉列表的选项数和选项值。例如 /第一个下拉列表/


选择
英语
泰米尔人
泰卢固
卡纳达
马来亚拉姆
乌尔都语
旁遮普
/第二个下拉列表,其选项和值的数量将根据更改上述下拉列表的值//进行更改/


印度快车
印度教徒报
有线电视新闻网国际广播公司
NDTV
我与它斗争了很长一段时间,即使这可以通过php完成,请为我提供一个解决方案

试试这个

HTML


这里的演示:

如果你必须这样做,只需要简单的javascript,你就可以这样做。这将导致一点肮脏的方法

我建议使用JQUERY和AJAX来实现这一点。发送AJAX请求以获取第二个下拉数据。检查一下这个样品


它正在工作,但如果我尝试使用另一个javascript fn()(jquery)来设置下拉列表的样式,它将无法工作。同样感谢上面的解决方案。请详细说明。我没有理解你。在这里,我尝试使用onchange的下拉列表,并尝试为这些下拉列表添加一些时尚的外观。当我使用没有任何样式的下拉列表时,您的代码工作得很好,但这不是问题,作为初学者,我不知道如何通过onchange方法使第二个下拉列表也工作。我试过了,但没有成功。我希望这两个下拉列表都能通过onChange工作。我还有一个疑问。在创建第二个下拉列表时,是否也可以为选项添加值。
<select name="language" id="language">
    <option>select</option>
    <option >English</option>
    <option>Tamil</option>
    <option>Telugu</option>
    <option >Kannada</option>
    <option>Malayalam</option>
    <option >Urdu</option>
    <option>Punjabi</option>
</select>
<select name="media">
    <option>The Indian Express</option>
    <option >The Hindu</option>
    <option >CNN IBN</option>
    <option>NDTV</option>
</select>
<select name="language" id="language" onchange="SetMedia(this)">
    <option>select</option>
    <option >English</option>
    <option>Tamil</option>
    <option>Telugu</option>
</select>

<select name="media" id="media" disabled="disabled">
    <option>select</option>
</select>
function SetMedia(objLanguage) {
    var objMedia = document.getElementById("media");
    objMedia.options.length = 0;
        objMedia.disabled = false;
    switch (objLanguage.value) {
    case "English":
        objMedia.options.add(new Option("The Indian Express"));
        objMedia.options.add(new Option("The Hindu"));
        break;
    case "Tamil":
        objMedia.options.add(new Option("Tamil Paper 1"));
        objMedia.options.add(new Option("Tamil Paper 2"));
        break;
    case "Telugu":
        objMedia.options.add(new Option("Telugu Paper 1"));
        objMedia.options.add(new Option("Telugu Paper 2"));
        break;
    default:
        objMedia.options.add(new Option("select"));
        objMedia.disabled = true;
        break;
    }
}