1

在另一个问题中，有人让我使用这种编写 jQuery 的方法.append()，但我似乎无法让它工作。控制台返回一个错误“意外字符串”，但我不知道我做错了什么。

不工作：

$(".create-form").submit(function(event){
    var title = $("#story-name").val();
    copy = $("#story-content").val();
    $(".storyboard").append(
        $("<li/>", className: "story").html(
            $("<span/>", className: "story-count") +
            $("<span/>", className: "story-title-input", content: title)));
});

我也试过用逗号代替“+”，.append()而不是.html()第一个附加元素。我可以通过写出所有的 html 来让它工作，但这感觉像是一种更简洁的方法。

4

3 回答 3

4

确保您丢失了{并且}为您的 json 初始化。

$(".create-form").submit(function(event){
    var title = $("#story-name").val();
    copy = $("#story-content").val();
    $(".storyboard").append(
        $("<li/>", { className: "story" }).html(
            $("<span/>", { className: "story-count" }) +
            $("<span/>", { className: "story-title-input", content: title } )));
});

然后我会替换这个

$("<li/>", { className: "story" }).html(
   $("<span/>", { className: "story-count" }) +
   $("<span/>", { className: "story-title-input", content: title } )));

经过

$("<li/>", { className: "story" })
   .append($("<span/>", { "class": "story-count" }))
   .append($("<span/>", { "class": "story-title-input", text: title } ));
于 2013-06-04T01:39:54.143 回答
4

此代码无效：

, className: 'story'

您可能正在寻找的是一个对象文字，尝试将参数包装成$('...')这样{}：

$(".create-form").submit(function(event){
    var title = $("#story-name").val();
    copy = $("#story-content").val();
    $(".storyboard").append(
        $("<li/>", {className: "story"}).html(
            $("<span/>", {className: "story-count"}) +
            $("<span/>", {className: "story-title-input", content: title})));
});
于 2013-06-04T01:40:33.223 回答
1

我认为这更具可读性，并且是一种更好的方法：

$('.create-form').on('submit', function(e){
    e.preventDefault();
    var title = $('#story-name').val(),
        copy  = $("#story-content").val(),
        li    = $('<li />',   {'class': 'story'}),
        span1 = $('<span />', {'class': 'story-count'}),
        span2 = $('<span />', {'class': 'story-title-input', text: title});

    $(".storyboard").append( li.append(span1, span2) );
});

您需要为元素属性使用对象

于 2013-06-04T01:42:56.153 回答