0

我有一个使用 jQuery 设置文本字段值的表单。首次加载页面时表单不起作用，但刷新页面后它确实起作用为了帮助描述问题，我录制了约 30 秒的视频（托管在 SwfCabin 上）：

知道可能是什么原因造成的吗？我是一个 jQuery 新手，我不知道！

这是jQuery代码

$(document).ready(function () {
    $(".category").each(function () {
        $(this).find("a").click(function (event) {
            event.preventDefault();
            var category = $(this).text();
            $("#post_categories").val(category);
        });
    });
});

这是HTML 表单：

<form accept-charset="UTF-8" action="/posts" class="new_post" id="new_post"
method="post">
    <div style="margin:0;padding:0;display:inline">
        <input name="utf8" type="hidden" value="&#x2713;" />
        <input name="authenticity_token" type="hidden" value="OCbmfFY1cNsaa5e+SbvcSrP0ubQTg432ECNGmvaU8bM="
        />
    </div>
    <p>
        <label for="post_title">Title</label>
        <input id="post_title" name="post[title]" type="text" />
    </p>
    <p>
        <label for="post_url">Url</label>
        <input id="post_url" name="post[url]" type="text" />
    </p>
    <p>
        <label for="post_categories">Pick a category</label>
        <input type="text" id="post_categories" />
    </p>
    <p>Available choices:</p>
    <ul>
        <li class="category"> <a href="">programming</a>

        </li>
        <li class="category"> <a href="">cats</a>

        </li>
        <li class="category"> <a href="">batman</a>

        </li>
    </ul>
    <p>
        <input name="commit" type="submit" value="Submit" />
    </p>
</form>
4

2 回答 2

1

看起来不错，确保你已经包含了 jQuery 库，你也可以稍微优化一下代码。

$(document).ready(function() {
     $('.category a').click(function(event){
         event.preventDefault();
         var category = $(this).text();
         $("#post_categories").val(category);
     });
 });

小提琴：http: //jsfiddle.net/DGW3Q/

于 2013-08-30T08:19:57.083 回答
0

我以为 Arun P Johny 和 Farhan 提供了我正在寻找的答案，但事实证明我遇到了不同的问题。我正在编写的应用程序是 Ruby on Rails，我没有得到关于 Rails 的Turbolinks如何覆盖某些 jQuery 功能的备忘录。

例如，默认情况下，在 Rails 4.0.0 中，Turbolinks 在页面加载时处理执行 JavaScript。这意味着我试图使用$(document).ready(;，但 Turbolinks 劫持了该功能。由于我还不完全理解的原因，刷新重新启用了我的 jQuery 脚本，然后它开始工作。我猜 Turbolinks 的版本$(document).ready(;在页面刷新时不会重置？

作为一个短期的 hack，我最终通过安装 RubyGem“jquery-turbolinks”解决了这个问题。在某些时候，我需要学习如何使用或禁用 Turbolinks。也许我应该学习使用 Angular 或 Ember :) DOM 恶作剧很痛苦！

Ryan Bates 在Railscases 的第 290 集讨论了 Turbolinks ，包括代码在页面加载时如何执行。

于 2013-08-30T20:09:09.360 回答