在一个文本框中获取多个值时出现问题

时间:2014-11-28 18:15:23

标签: javascript ajax

我有四个框,我想在一个文本中获取这些值,如果我单击一个框然后文本中的一个值,如果我点击两个文本框文本得到两个值也我想用逗号分隔值。

<li><a href="javascript:void(0)"  onclick="check_stalls('A-14')"  id="A-14">A-14</a></li>
    <li ><a href="javascript:void(0)" onclick="check_stalls('A-13')" id="A-13">A-13</a></li>
    <li ><a href="javascript:void(0)" onclick="check_stalls('A-12')" id="A-12">A-12</a></li>
    <li ><a href="javascript:void(0)" onclick="check_stalls('A-11')" id="A-11">A-11</a></li>

<input type="text" name="selected_stals" id="selected_stals" />

function check_stalls(stalno)
{
    alert(stalno);

    document.getElementById(stalno).style.backgroundColor = "#FF0";

    var textbox = document.getElementsByName("selected_stals")[0];
var checkboxes = stalno;

alert(checkboxes);
for (var i = 0; i < checkboxes.length; i++) {
    var checkbox = checkboxes[i];
    checkbox.onclick = (function(chk){
        return function() {
            var value = "";
            for (var j = 0; j < checkboxes.length; j++) {
                if (checkboxes[j].checked) {
                    if (value === "") {
                        value += checkboxes[j].value;
                    } else {
                        value += "," + checkboxes[j].value;
                    }
                }
            }
            textbox.value = value;
        }
    })(textbox);
}  


}

我试着像复选框一样,但它不起作用......

2 个答案:

答案 0 :(得分:1)

HTML

<ul><li><a href="#"  id="A-14">A-14</a></li>
    <li ><a href="#" id="A-13">A-13</a></li>
    <li ><a href="#" id="A-12">A-12</a></li>
    <li ><a href="#" id="A-11">A-11</a></li></ul>

<input type="text" name="selected_stals" id="selected_stals" />

JS(jquery)

$(function(){
    $('a').click(function(){
        var val = $(this).text();
        var text = $('#selected_stals').val();
        var newText = val;
        if(text != ""){
            newText += "," + text;
        }
        $('#selected_stals').val(newText);
    });
})

http://jsfiddle.net/xhnsucgw/5/

希望你想要什么。

答案 1 :(得分:0)

你用“jquery”标记你的帖子,所以假设你正在使用jQuery,并假设我正确理解你,我会像这样解决它:

<ul id="boxes">
   <li><a href="#" id="A-14">A-14</a></li>
   <li><a href="#" id="A-13">A-13</a></li>
   <li><a href="#" id="A-12">A-12</a></li>
   <li><a href="#" id="A-11">A-11</a></li>
</ul>

<input type="text" name="selected_stals" id="selected_stals" />

...你会把它与你的其他脚本一起使用:

$("#boxes a").on("click", function(e){
    if($("#selected_stals").val() == ""){
        $("#selected_stals").val($(this).html());
    }else{
        $("#selected_stals").val($("#selected_stals").val()
            + ", " + $(this).html());
    }
});

这是a JSFiddle of it working