如何使用javascript的两个下拉菜单选择进行页面重定向

Question

我是JavaScript的初学者，非常感谢您对我的问题的帮助。

我需要有两个下拉菜单，每个菜单都带有URL值，当选中它们时，将它们附加在一起并在单击“提交”按钮后重定向到选定的URL。

它类似于类似文章中的实时示例： http : //www.jsfiddle.net/Yxw7k/13

如果第一个下拉菜单中第二个选项的值是/a/something1 ，而第二个下拉菜单中第三个选项的值是/3/index.html ，则在点击/3/index.html之后，您将被重定向到我希望能在不使用jQuery的情况下实现这一目标www.somesite.com/a/something1/3/index.html 我如何使用常规JS来实现这一目标？

Answer 1

我建议类似以下内容：

function makePath(directory, file, domain) {
    if (!directory || !file) {
        return false;
    }
    else {
        directory = directory.nodeType == 1 ? directory.value : document.getElementById(directory).value;
        file = file.nodeType == 1 ? file.value : document.getElementById(file).value;
        return newURL = [domain || 'http://' + location.hostname, directory, file].join('/');
    }
}

document.getElementById('fileName').onblur = function(){
    // using console.log() in the demo
    document.location = makePath('directoryPath', this, 'http://example.com');
}

JS小提琴演示 。

上面的代码与以下HTML结合使用：

<select id="directoryPath">
    <option>directoryA</option>
    <option>directoryB</option>
    <option>directoryC</option>
</select>


<select id="fileName">
    <option>file1.html</option>
    <option>file2.html</option>
    <option>file3.html</option>
</select>

Answer 2

使用jquery更容易选择值，您可以让一个函数检测用户选择的值，然后在用户按下Submit按钮时更新重定向链接。 因此，您需要将该函数添加到按钮的onclick事件中。