将文本添加到输入字段,而不是用ListView + jQuery Mobile替换它

时间:2013-02-03 18:30:14

标签: jquery listview mobile filter

我想要完成的任务:

单击按钮会添加一个单词来过滤jQuery Mobile ListView。

HTML:

<ul data-role="listview" data-theme="a" data-divider-theme="c">
                <li data-role="list-divider" data-inset="true">
                    <div data-role="controlgroup"  data-type="horizontal" data-mini="true" id="filterButton">
                        <a href="#" data-role="button" data-inline="true">Iedereen</a>
                        <a href="#" data-role="button" data-inline="true">LinkedIn</a>
                        <a href="#" data-role="button" data-inline="true">Facebook</a>
                        <a data-role="button" style="width: 4px;"></a>
                        <a href="#" data-role="button" data-inline="true" class="filterAdd">Design</a>
                        <a href="#" data-role="button" data-inline="true">Development</a>
                    </div>
                </li>
            </ul>
            <ul data-role="listview" data-filter="true" data-theme="d" data-divider-theme="d" data-filter-placeholder="Search Connections...">
                <li data-theme="b"><a href="index.html">
                    <img src="http://a0.twimg.com/profile_images/1353509401/DSC_3465_bigger.jpg" class="ui-li-thumb zapp-corner zapp-margin-5 zapp-inner-shadow" />
                    <h3>Stephen Weber</h3>
                    <p><strong>You've been invited to a meeting at Filament Group in Boston, MA</strong></p>
                    <p>Hey Stephen, if you're available at 10am tomorrow, we've got a meeting with the jQuery team.</p>
                    <p class="ui-li-aside"><strong>LinkedIn</strong></p>
                </a></li>

的JavaScript

$(document).ready(function () {
                    $("#filterButton").delegate("a", "click", function () {
                        $("div.ui-input-search").find("input").val($(this).text());
                        $("div.ui-input-search").find("input").keyup();
                    });
}); 

此时它会替换输入字段中的整个值,而不是将其添加到现有值。

http://jsfiddle.net/J4HZp/6/

1 个答案:

答案 0 :(得分:2)

$("#filterButton").delegate("a", "click", function () {
     var txt = $(this).text();
     $("div.ui-input-search").find("input").val(function(i, currentValue) {
        return currentValue + txt;
     }).trigger('keyup');
});