Jquery Tokeninput如何获取名称而不是id [关闭]

Posted 2023-05-09

【中文标题】Jquery Tokeninput如何获取名称而不是id [关闭]

【英文标题】：Jquery Tokeninput how to get name instead of the id [closed]

【发布时间】：2012-03-02 13:27:44

【问题描述】：

我尝试调用它，但它似乎没有返回任何内容。我做错了什么吗？

     <script type="text/javascript">
            $(document).ready(function() 
                $("input[type=button]").click(function () 
                    alert("Would submit: " + $(this).siblings("input[type=text]").val());
                );
            );


    $(document).ready(function() 
    $("#button1").click(function() 


                    var abc = $('#demo-input-local').tokenInput("get");
                    alert(abc);
                    alert(abc[7].name);

       var inputval =$(this).siblings("input[type=text]").val();
       alert("inputval " +inputval);

alert(abc[inputval].name);

      $("#some-text").focusEnd();

       $('#some-text').val($('#some-text').val()+'  ' + inputval);

    );
    );

            </script>

    <label> Enter Phone or Email or http: </label><input type="text" id="demo-input-local" name="blah" /><input type="button" id="button1" value="Submit" />
                                        <script type="text/javascript">
                                            $(document).ready(function () 
                                                $("#demo-input-local").tokenInput([
                                                 id: 7, name: "[e-mail]", "value": "@" , "prefix": "Email1",
                                                 id: 11, name: "[e-mail]", "value": "@" ,"prefix": "Email2",
                                                 id: 13, name: "[e-mail]", "value": "@" ,"prefix": "Email3",
                                                 id: 17, name: "[e-mail]", "value": "@", "prefix": "Email4" ,
                                                 id: 19, name: "[e-mail]", "value": "@", "prefix": "Email5" ,
                                                 id: 23, name: "www.C#.com", "value": "http", "prefix": "Website1" ,
                                                 id: 29, name: "www.C.com", "value": "http", "prefix": "Website2" ,
                                                 id: 31, name: "www.Fortran.com", "value": "http", "prefix": "Website3" ,
                                                 id: 37, name: "www.VisualBasic.com", "value": "http", "prefix": "Website4" ,
                                                 id: 41, name: "www.DoC.com", "value": "http", "prefix": "Website5" ,
                                                 id: 43, name: "www.C++.com", "value": "http" , "prefix": "Website6",
                                                 id: 47, name: "www.Java.com", "value": "http" , "prefix": "Website7",  
                                                 id: 37, name: "111-111-1111", "value": "#", "prefix": "Phone1" ,
                                                 id: 41, name: "222-222-2222", "value": "#", "prefix": "Phone2" ,
                                                 id: 43, name: "333-333-3333", "value": "#" , "prefix": "Phone3",
                                                 id: 47, name: "555-555-5555", "value": "#" , "prefix": "Phone4"


                                             ], 
                                                 theme: "facebook",

                                                 propertyToSearch: "value",
                                                 hintText: "Type '@' for email or 'http' for website  or '#' for phone",
                                                 tokenFormatter: function (item)  return "<li><p>" +  item.prefix + "</p></li>" ,
                                                 resultsFormatter: function (item)  return "<li>" + item.prefix +" "+ item.name + "</li>" 
                                             );
                                            );
                                        </script>
                                    </div>

【问题讨论】：

你已经完全修改了你原来的问题 user244394！！

【参考方案1】：

如果您只是想提醒以逗号分隔的名称列表，请尝试以下操作：

javaScript：

$(document).ready(function() 
    $("input[type=button]").click(function() 
        var names = [];
        $(this).siblings("ul").find('li p').each(function()
            names.push($(this).html());
            //names.push($(this).text());//possibly better
        );
        alert("Names are: " + names.join());
    );
);

但是，据我所知，实际提交的值仍然是一个逗号分隔的 id 列表。

以上是非常原始的方法。您可以类似地循环遍历 ABC 指出的 .tokenInput("get"); 方法返回的数组。

假设 ABC 关于.tokenInput("get"); 的说法是正确的，那么这应该有效：

javascript：

$("input[type=button]").click(function() 
    var arr = $(this).siblings("input[type=text]").tokenInput("get");//Returns (we think) an array of objects
    var names = [];
    $.each(arr, function(i, obj)
        names.push(obj.name);//build an array of just the names
    );
    alert("Names are: " + names.join());
);

【讨论】：

谢谢你看到我的代码我正在尝试 .tokenInput("get");但它没有返回任何东西 var abc = selector.tokenInput("get"); abc[0].id; // 对于第一个数组元素 abc[0].name ami 缺少什么？

根据 ABC 所说，我在上面的答案中添加了更多代码，循环遍历 .tokenInput("get"); 返回的数组。

【参考方案2】：

亲爱的你为什么不使用tokenInput自己的方法来获取对象

selector.tokenInput("get");

这就是您从令牌输入中获取选定令牌数组的方式（每个项目都是 id: x, name: y 类型的对象）。 进一步

 var abc = selector.tokenInput("get");
 abc[0].id; // for first array element
 abc[0].name

【讨论】：

我用你的代码更新了我的代码，当我调用 abc[0].name 时它似乎没有返回任何值 有什么我遗漏的吗？我在上面发布了我的代码-谢谢

亲爱的你最好再次查阅loopj.com/jquery-tokeninput tokenInput 文档

根据 ABC 所说，我在上面的答案中添加了更多代码，循环遍历 .tokenInput("get"); 返回的数组。

哎呀，发错地方了，看我自己的回答。