Question

基本上我试图让jQuery在点击后用表单和状态div替换按钮。

我是jQuery的新手，几乎不是高级程序员，所以我相信解决方案会相对简单。另一方面，我在这个问题的最后，我的任何帮助将非常赞赏。谢谢。

编辑：找到解决方案。有趣的是它也只有当我把它放在一个单独的.js文件中并引用它时才会起作用，当我在php页面上的标签中使用它时，不是。再次感谢所有回复的人！

$(document).ready(function() { 
   $("#repbutton").click(function() {
   $("#repbutton").replaceWith("<form id=\"reputation_form\" method=\"post\">
    Give positive reputation to <?=$reply_user['username']?> for their reply?
    Comment: <input type=\"text\" name=\"comment\" id=\"comment\" /> 
             <input type=\"hidden\" id=\"uid\" value=\"<?=$reply_user['id']?>\">
             <input type=\"hidden\" id=\"rid\" value=\"<?=$replies_row['id']?>\">
             <input type=\"hidden\" id=\"urid\" value=\"<?=$user_row['id']?>\">
             <input type=\"submit\" value=\"Give Reputation\" />
</form>
<div id=\"status\">
        <p></p>
    </div>"); 

    });
   });

Answer 1

除非您使用\转义它们，否则换行符在字符串文字中无效。简单地说，要么将字符串压缩到一行，要么将\添加到每行的末尾：

$(document).ready(function() { 
   $("#repbutton").click(function() {
   $("#repbutton").replaceWith("<form id=\"reputation_form\" method=\"post\">\
    Give positive reputation to <?=$reply_user['username']?> for their reply?\
    Comment: <input type=\"text\" name=\"comment\" id=\"comment\" /> \
             <input type=\"hidden\" id=\"uid\" value=\"<?=$reply_user['id']?>\">\
             <input type=\"hidden\" id=\"rid\" value=\"<?=$replies_row['id']?>\">\
             <input type=\"hidden\" id=\"urid\" value=\"<?=$user_row['id']?>\">\
             <input type=\"submit\" value=\"Give Reputation\" />\
</form>\
<div id=\"status\">\
        <p></p>\
    </div>");

    });
});

工作示例 - http://jsfiddle.net/rd4w9/

Answer 2

为什么不在点击时隐藏按钮，并显示表单？

Answer 3

尝试使用append()，prepend()和html()函数来操作DOM。这样做可能会使自己感到困惑并遇到各种各样的问题。

你应该能够

隐藏按钮
将表单的HTML附加到按钮所在的元素

然后在完成表单

后轻松完成以下操作

再次显示按钮
删除表单

Answer 4

你不能在JavaScript中使用这样的字符串中的return语句，你需要在每一行的末尾使用\将其声明为多行字符串，如下所示：

$(document).ready(function() { 
   $("#repbutton").click(function() {
   $("#repbutton").replaceWith("<form id=\"reputation_form\" method=\"post\"> \
    Give positive reputation to <?=$reply_user['username']?> for their reply? \
    Comment: <input type=\"text\" name=\"comment\" id=\"comment\" /> \
             <input type=\"hidden\" id=\"uid\" value=\"<?=$reply_user['id']?>\"> \
             <input type=\"hidden\" id=\"rid\" value=\"<?=$replies_row['id']?>\"> \
             <input type=\"hidden\" id=\"urid\" value=\"<?=$user_row['id']?>\"> \
             <input type=\"submit\" value=\"Give Reputation\" /> \
</form> \
<div id=\"status\"> \
        <p></p> \
    </div>"); 

    });
});

You can give it a try here

无法让jQuery的.replaceWith（）工作？

4 个答案: