Question

在以下代码中，我想将data-filter的值更改为用户提交的字段，然后将该输入合并到链接中。

<a href="#" id="gallery_filter" class="sidebar-search"
     data-filter="(get user input here)">

到目前为止，我已经尝试过ajax对象，jquery移动过滤器和常规HTML。我尝试了大约20种不同的方法，最新的jQuery移动过滤器。

  <ul data-role="listview" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search tags..." data-inset="true">
                                    <!-- foreach $tags as $tag [get all tags loop] -->
                                    <li><a href="#">$tag[0]</a></li>
                               </ul>

Answer 1

如果我理解了这个问题，你想根据用户输入修改DOM（在你的情况下，一个链接）。如果是这样的话，您不必提交表单，基本上应该采用简单的方法，使用简单的jQuery：

$(function() {
    var input_el = $("#user_input");
    var link_el = $("#link");

    input_el.keyup(function() {
        var value = input_el.val();
        link_el.attr('data-filter', value);
    });
});

您可以在此处看到此操作，在此示例中：http://jsfiddle.net/4bBSF/

但是，如果您真的需要提交表单，还可以添加要在提交时执行的函数：

<form onsubmit="updateLink()"> ... </form>

onsubmit函数在表单发送之前执行。然后updateLink函数将执行类似于上面示例的操作，将输入值添加到链接。

现在，如果你真的想进一步尝试一些有趣的东西，请阅读有关数据绑定的内容。有许多支持数据绑定的库和框架，包括AngularJS，Ember和Meteor。

如何在链接中嵌入提交表单？

1 个答案: