1
 form=jQuery("<form>"
            ,{
                "method":"post"
                ,
                "action":node.get("inline-edit-target")

            }
            );


        $(node).after(form);
        //console.log($(node).html());

        fieldNode=$(node).find(".inline-edit-field");
        console.log(fieldNode.length);
        fieldNode.each(function(index,elem)
        {
            console.log($(elem).data("field-name"));

            $(form).append("<span>").html($(elem).data("field-name"));
            $(form).append("<input>"
                ,{
                    "type":"text"
                    ,
                    "name":$(elem).data("field-name")
                    ,
                    "value":$(elem).text()
                });       
        }
        );

基本的にDOMをチェックしてフォームを準備します。form は 2 つのフィールドを正しく解析します (fieldNode.length は正しい数値を生成します)。spanまた、タグを追加するまでノードを正しく出力します。なぜ機能しないのですか?

4

1 に答える 1

2

それが唯一の問題である場合、問題は次の行です。

$(form).append("<span>").html($(elem).data("field-name"));

そして、新しい要素自体ではなくappend()、新しい要素が追加された元の要素を返すという事実に由来します(概念の証明)。

したがって、 aspanを追加してから、すぐに親 div の HTML を が$(elem).data('field-name')返すものに上書きします。

また、jQuery はオブジェクトを使用して要素を作成しない (または作成できない) ため、直後の行で問題が発生します。追加 (失敗の証明) ではなく、html の文字列を使用する必要があります。 、あなたの場合のように:

$(form).append('<input type="text" name="' + $(elem).data('field-name') + '" value="' + $(elem).text() + '" />');

または(これはおそらく簡単です):

$(form).append($("<input />" ,{
    "type" : "text",
    "name" : $(elem).data("field-name"),
    "value" : $(elem).text()
}));
于 2013-07-20T01:46:30.480 に答える