Question

如何在下拉列表中获取所选值并将其附加到site_url？我无法弄清楚如何做到这一点。请指出我的正确方向。谢谢。

<form name="filterByDate" method="post">
<h3>Filter Suggestion</h3>&nbsp;
    <select name="year">
        <option value="2013">2013</option>
        <option value="2014">2014</option></select>

    <ul>
        <li><a href="<?php echo site_url("suggestion/filter/1/". HOW TO APPEND SELECTED VALUE HERE ."); ?>">Jan</a></li>
        <li><a href="<?php echo site_url("suggestion/filter/2"); ?>">Feb</a></li>
    </ul>

</form>

我编辑了下面接受的答案：这是编辑部分：

 var linksContainer=document.getElementById("linksContainer");
 linksContainer.innerHTML="<li><a href=\"javascript:window.location('<?php echo site_url(); ?>/suggestion/filter/1/"+selval+"');\">January</a>

Answer 1

尝试使用以下代码:(略有改动）

<html>
<body>
<form name="filterByDate" method="post">
<h3>Filter Suggestion</h3>&nbsp;
    <select name="year" onchange="generateLinks(this);">
        <option value="2013">2013</option>
        <option value="2014">2014</option></select>

    <!-- <ul>
        <li><a href="<?php echo site_url("suggestion/filter/1/". HOW TO APPEND SELECTED VALUE HERE ."); ?>">Jan</a></li>
        <li><a href="<?php echo site_url("suggestion/filter/2"); ?>">Feb</a></li>
    </ul> -->

    <ul id="linksContainer">
    </ul>

</form>

<script type="text/javascript">
function generateLinks(obj){
    var selval=obj[obj.selectedIndex].value;
    var linksContainer=document.getElementById("linksContainer");
    linksContainer.innerHTML="<li><a href=\"javascript:site_url('suggestion/filter/1/"+selval+"');\">Jan</a></li>";
}
</script>
</body>
</html>

Answer 2

然后使用jQuery，然而id改进标记以获得我想要定位的标记的类/ ID。给选择一个类/ id并在脚本和UL和/或要作为目标的链接中使用它。

function saveUrl($item, url ) {
  $item.attr('data-url', url);
}

 // save all the links original href
 $('ul a').each(function() {
    saveUrl( $(this), $(this).attr('href') );
 });

 // on change make the links go to the actual year
 $('.select-year').on('change', function() {

    var $link = $('ul a'),
         linkDataUrl = $link.attr('data-url'),
         selectedOption = $(this).val(),
         newUrl = linkDataUrl + selectedOption;

    $link.attr('href', newUrl);

 });

Answer 3

以下内容将为您提供下拉列表中选定的文字值

$("#yourdropdownid option:selected").text();

及以下将给出所选索引 $（“＃yourdropdownid”）。val（）

您可以将索引或文本传递给锚点以传递url并调用onclick事件方法请参考下面的示例代码

<a href="javascript:void(0)" id="myAnchor">Jan</a>

JS

document.getElementById('myAnchor').onclick = function() {
    // this is the <a> in here
    window.location.replace("Pass the value from Dropdown from above methods");
    return false; // optional, prevents href from executing at all 
};

如何在下拉列表中传递选定的值并附加到site_url中？

3 个答案: