通过多个链接发布或获取多个值

post or get multiple values with multiple links

本文关键字:获取 链接 接发      更新时间:2023-09-26

我是新手,所以请耐心等待…

我希望能够通过使用链接传递多个变量到另一个页面,例如:

<a href="value1">some text</a>,<a href="value2">some text2</a>,<a href="value3">some text3</a>,<a href="value4">some text4</a>

我希望能够使用这个作为"多选择器",这样用户就可以点击(选择)任何他们想要的文本,并以某种方式与提交按钮通过post或get发送这些选定的值。

我不想使用菜单或列表,因为我试图显示文本和每个链接持有文本的不同部分,在一个章节的段落,所以用户会点击一个段落(这是一个链接,或至少看起来像一个),并发送它的值到其他页面,但我想要多个段落,以便用户能够选择,如果可能的话,取消选择段落。

希望有人能给我指路

我将如何实现它:

:

<a data-id="value1" href="value1">some text</a>,<a data-id="value2" href="value2">some text2</a>,<a data-id="value3" href="value3">some text3</a>,<a data-id="value4" href="value4">some text4</a>
<input type="button" id="submit" value="submit"></input>
Javascript:

var els = document.getElementsByTagName("a");
var sz = els.length;
var o = {};
for(var n = 0; n < sz; ++n) {
    els[n].onclick = function(e) {
        e.preventDefault();
        var s = e.currentTarget.getAttribute("data-id");
        if(o[s] !== undefined) {
            delete o[s];
        } else {
            o[s] = "";
        }
    };
}
document.getElementById("submit").onclick = function(e) {
    var s = "";
    for(key in o) {
        s += key + "&";
    }
    var location = s.substring(0, s.length-1);
    // redirect user using location as parameter list or send ajax request
};

(我在上面使用映射而不是数组,以避免每次单击都必须遍历数组)

http://jsfiddle.net/5y7wK/

传递多个值的最佳方式是通过表单提交或AJAX请求,您可以使用多个复选框,以便当用户选择所需的值并在单个请求中发送它们时。

这里有一个示例:sample


<form action="/myurl" method="POST">
        <input id="Val1" name="paragraph" type="checkbox" value="value1"/>
        <label for="Val1">Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
        In egestas tempus dictum. Mauris purus urna, congue non scelerisque non,
        feugiat at arcu. Donec venenatis facilisis fermentum. Morbi ac lorem odio. 
        Cras nulla justo, pharetra et placerat ut, sagittis nec urna. 
        Praesent luctus, sem ac lobortis aliquam, purus sapien tempor dui, nec 
        pretium metus leo eu ligula. Cras ac egestas dolor. 
        </label>
        </br>
        </br>
        <input id="Val2" name="paragraph" type="checkbox" value="value2"/>
        <label for="Val2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
        In egestas tempus dictum. Mauris purus urna, congue non scelerisque non,
        feugiat at arcu. Donec venenatis facilisis fermentum. Morbi ac lorem odio. 
        Cras nulla justo, pharetra et placerat ut, sagittis nec urna. 
        Praesent luctus, sem ac lobortis aliquam, purus sapien tempor dui, nec 
        pretium metus leo eu ligula. Cras ac egestas dolor. </label>
        </br>
        <input type="submit"/>
    </form>