如何使用其他条件为单个表单提交按钮提供不同的链接

我的网页执行数学计算。我在上面放置了5个复选框。根据所选的复选框，我希望该页面使用JavaScript定向到特定链接。如何根据所选的复选框在JavaScript中添加这些链接？

<div id="angl">
    <input type="checkbox" id="ph" onclick='select()' checked><span id="phi1">Phi(φ)</span>
    <input type="checkbox" id="psi"><span id="psi1">Psi(ψ)</span>
    <input type="checkbox" id="omega"><span id="omega1">Omega(ω)</span>
    <input type="checkbox" id="calpha"><span id="calpha1">C-Alpha (C-α)</span>
    <input type="checkbox" id="chi" onchange="ang_type()"><span id="chi1">Chi(χ)</span>
</div>

可以说我有5个链接：

'phi.pl'，'psi.pl'，'omega.pl'，'calpha.pl'，'chi.pl'

当用户可以响应选择多个答案时，请使用复选框。那么，如果您的用户使用多个页面，您计划如何重定向到几页？ - 抱歉，如果我不正确理解您。

但是，如果我正确理解您：例如用户选择某些东西，然后基于选择，然后将其重定向到特定的链接。然后有选项：

使用jQuery并将其绑在动作上
使用表单提交，因此当用户选择并提交时，他或她被重定向。

您需要在表格上提交之前需要此此事，以便在以下功能中使用ajax

$('FormSelector').submit(function() {
    //make ajax request base don codition to one of 'phi.pl', 'psi.pl' , 'omega.pl' , 'calpha.pl' , 'chi.pl'.
    return false; // return false to cancel form submit
});

或使用JavaScript更改表单操作属性，然后通过返回true提交执行任务。

 $('FormSelector').submit(function() {
     //change attribute action based on condition to one of 'phi.pl', 'psi.pl' , 'omega.pl' , 'calpha.pl' , 'chi.pl'.
     return true; // return false to cancel form submit
});

使用'this'运算符。

function savevalue(me){
console.log(me.value);
}

<html>
<body>
<input type=checkbox value= 'omega.php' onchange = 'savevalue(this)' id='omega'><span id='omega1'>Omega(ω)</span></input>
<input type=checkbox value= 'psi.php' onchange = 'savevalue(this)' id='psi'><span id='psi1'>Psi(ψ)</span></input>
</body>
</html>

假设复选框在一个表单内，其提交按钮是id" form_submit"，那么您可以尝试以下jQuery代码：

<script type="text/javascript">
$(document).ready(function(){
    $('#form_submit').live('click', function (e) {
        e.preventDefault();
        if($('#phi').is(":checked")){
            window.location.href="'phi.pl";
        }else if($('#psi').is(":checked")){
            window.location.href="psi.pl";
        }else if($('#omega').is(":checked")){
            window.location.href="omega.pl";
        }else if($('#calpha').is(":checked")){
            window.location.href="calpha.pl";
        }else if($('#chi').is(":checked")){
            window.location.href="chi.pl";
        } else{
            alert("Invalid request!");
        }
});

相关内容

最新更新

热门标签：