正在更改Url参数

Changing Url parameters

本文关键字：Url 参数更新时间：2024-04-28

我正试图根据我点击的按钮来更改URL参数。在这里，我设置了一些javascript来根据点击的按钮更改屏幕显示的内容：

<script language="Javascript">
    //How many Questions 
    function Questions(){
       document.getElementById("Questions").style.visibility="visible";
       document.getElementById("Manual").style.visibility="hidden";
       document.getElementById("Load").style.visibility="hidden";
    }
    //Manual
    function Manual(){
       document.getElementById("Questions").style.visibility="hidden";
       document.getElementById("Manual").style.visibility="visible";
       document.getElementById("Load").style.visibility="hidden";  
    }
    //Load Data from Form
    function Load(){
        document.getElementById("Questions").style.visibility="hidden";
        document.getElementById("Manual").style.visibility="hidden";
        document.getElementById("Load").style.visibility="visible";   
    }
</script>

<!--VT Buttons-->
<div id="enterDataToggle" class="btn-group" data-toggle="buttons" >
<!--VT Defualt-->
<label class="btn btn-default active" id="checkin-label"
     <input type="radio" checked onClick="Questions()">
     Default
</label>
<!--VT Input Data Manually-->
<label class="btn btn-default active" id="checkin-label"
    <input type="radio" onClick="Manual()">
        Input Data Manually
</label>
<!--VT Load Data from File-->
<label class="btn btn-default active" id="checkin-label"
    <input type="radio" onClick="Load()">
        Load Data from File
    </label>

这里是我设置URL参数的地方：

            <!--VT How many Questions-->
            <div style="position:absolute" id="Questions" >
                <h4>How many questions were on the ballot?</h4>
                <input name="votingDist" type="radio" value="-1"=> Short: 1-3 questions<br>
                <input name="votingDist" type="radio" value="0"> Medium: 4+ qustions<br>
                <input name="VTMean" value="61.11"; style= "visibility:hidden;" type="text" style="width:100%">
                <input name="VTMean" value="128.69"; style= "visibility:hidden;" type="text" style="width:100%">
                <input name="VTStd" value="-1"; style= "visibility:hidden;" type="text" style="width:100%">
            </div>
            <!-- VT Input Data Manually--> 
           <!--CT Default-->
            <div style=" visibility:hidden; position:absolute" id="Manual" >
                <input name="votingDist" value="1"; style= "visibility:hidden;" type="text" style="width:100%">
                <table class="table table-bordered table-striped">
                    <thead>
                        <tr>
                            <th>
                                Mean
                            </th>
                            <th>
                                Standard Deviation
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <th>
                                 <input name="VTMean" type="text" style="width:100%">
                            </th>
                            <th>
                                 <input name="VTStd" type="text" style="width:100%">
                            </th>
                        </tr>
                    </tbody>
                </table>
            </div>

            <!-- Load Data from File--> 
            <div style="visibility:hidden; position:relative" id="Load">
                <h4>Load Data from File</h4>
                <input name="arrivalFile" type="file" name="fileField"><br>
            </div>

问题是我的URL出现了重复的参数：http://localhost:8080/CrunchifyJSPServletExample/CrunchifyServlet?votingDist=-1&VTMean=61.11&VTMean=128.69&VTStd=-1&votingDist=1&VTMean＝200&VTStd=20

我正试图找到一种方法，当单击不同的按钮时替换参数的值。有办法做到这一点吗？非常感谢您的帮助！：）

您可以使用对象并设置属性。因此，如果您再次设置，它将覆盖该值。然后您可以将其转换为url参数格式：

var params = {};
params['votingDist'] = -1;
params['votingDist'] = 2;
params['VTMean'] = 200;
params['VTMean'] = 300;
var urlParamsToSet = Object.keys(params)
  .reduce((a, b) => `${a}${a ? '&' : '?'}${b}=${params[b]}`, '');
// ?votingDist=2&VTMean=300

然后使用urlParamsToSet更改url。