如何压缩更多jquery文件

有谁能帮我重新制作函数open（“var”）和.post000（“var”）吗 我的意思是，当我点击#open2 post将是post0002等。什么功能不是4等。。。 当我按下链接回答时，它会显示一个表单。这个js很好用，但是它太大了，没有用。我需要制作通用js

<div id="commentwindow">
        <form name="comment" action="#" method="post">
           <p><input class="name" type="text" maxlength="25" required placeholder="tell your name" formmethod="get"></p>
           <textarea  class="flud" required placeholder="insert text"></textarea>
           <p class="clearfix nopadding"><input class="submit" type="submit" value="add comment" formaction="#"></p>
        </form>
    </div>
    <ul class="postList">
        <li class="post post0004">
            <header>
                <span class="nameaccount">name</span>
                <span class="time">time</span>
            </header>
            <p>text</p>
            <footer>
                <a class="link open" id="open4" href="#open4">answer</a>
                <div class="empty"></div>
            </footer>
        </li>
        <li class="post post0002">
            <header>
                <span class="nameaccount">name</span>
                <span class="time">time</span>
            </header>
            <p>text</p>
            <footer>
                <a class="link open" id="open2" href="#open2">answer</a>
                <div class="empty"></div>
            </footer>
            <ul class="answer">
                <li class="post post0003">
                    <header>
                        <span class="nameaccount">name</span>
                        <span class="time">time</span>
                    </header>
                    <p></p>
                    <footer>
                        <a class="link open" id="open3" href="#open3">Answer</a>
                        <div class="empty1"></div>
                    </footer>
                </li>
            </ul>
        </li>
        <li class="post post0001">
            <header>
                <span class="nameaccount">name</span>
                <span class="time">time</span>
            </header>
            <p></p>
            <footer>
                <a class="link open" id="open1" href="#open1">Answer</a>
                <div class="empty"></div>
            </footer>
        </li>
    </ul>
</div>
    <script>
    $(document).ready(function () {
        $("#open1").click(function() {
            var formContent = $("#commentwindow").html();
        $(".post0001 .empty").html(formContent);
            $(".post0003 .empty").html("");
            $(".post0004 .empty").html("");
            $(".post0002 .empty").html("");
        });
    });
    $(document).ready(function () {
        $("#open2").click(function() {
            var formContent = $("#commentwindow").html();
            $(".post0002 .empty").html(formContent);
            $(".post0003 .empty1").html("");
            $(".post0004 .empty").html("");
            $(".post0001 .empty").html("");
        });
    });
    $(document).ready(function () {
        $("#open3").click(function() {
            var formContent = $("#commentwindow").html();
            $(".post0003 .empty").html(formContent);
            $(".post0004 .empty").html("");
            $(".post0002 .empty").html("");
            $(".post0001 .empty").html("");
        });
    });
    $(document).ready(function () {
        $("#open4").click(function() {
            var formContent = $("#commentwindow").html();
            $(".post0004 .empty").html(formContent);
            $(".post0003 .empty").html("");
            $(".post0002 .empty").html("");
            $(".post0001 .empty").html("");
        });
    });
</script>

名称
时间



$（文档）.ready（函数（）{
$（“#open1”）。单击（函数（）{
var formContent=$（“#commentwindow”）.html（）；
$（.post0001.empty”）.html（formContent）；
$（“.post0003.empty”）.html（“”）；
$（“.post0004.empty”）.html（“”）；
$（“.post0002.empty”）.html（“”）；
});
});
$（文档）.ready（函数（）{
$（“#open2”）。单击（函数（）{
var formContent=$（“#commentwindow”）.html（）；
$（“.post0002.empty”）.html（formContent）；
$（.post0003.empty1”）.html（“”）；
$（“.post0004.empty”）.html（“”）；
$（“.post0001.empty”）.html（“”）；
});
});
$（文档）.ready（函数（）{
$（“#open3”）。单击（函数（）{
var formContent=$（“#commentwindow”）.html（）；
$（“.post0003.empty”）.html（formContent）；
$（“.post0004.empty”）.html（“”）；
$（“.post0002.empty”）.html（“”）；
$（“.post0001.empty”）.html（“”）；
});
});
$（文档）.ready（函数（）{
$（“#open4”）。单击（函数（）{
var formContent=$（“#commentwindow”）.html（）；
$（.post0004.empty”）.html（formContent）；
$（“.post0003.empty”）.html（“”）；
$（“.post0002.empty”）.html（“”）；
$（“.post0001.empty”）.html（“”）；
});
});

您可以使用多个选择器以多个元素为目标：

$(".post0003 .empty").html("");
$(".post0004 .empty").html("");
$(".post0002 .empty").html("");

变成

$(".post0003 .empty, .post0004 .empty, .post0002 .empty").html("");

两者都做同样的事情

您可以通过将open#元素更改为具有数据属性来进一步压缩它，例如：

<button id="open1" class="openButton" data-num="1">Click me</button>

并在函数中执行以下操作：

var num = $(this).data("num");

现在你知道是不是按钮1，2，3，等等

然后将所有

.postXXXX

html内容设置为

”

，并根据num的值只设置不同的内容

---

所有这些都将大大压缩代码并使其整体更整洁。

您可以通过选择单击的元素id来实现这一点。 尝试使用这个函数

function(event){
    var postNo = $(this).get('id');
    var postClass = "post000" + postNo.substr(4) 
    var formContent = $("#commentwindow").html();
    $(".empty").html("");
    $("." + postClass+" .empty").html(formContent);
}

---

你需要告诉我们更多关于你想要完成的事情。我们还想看看html。在我看来，您似乎在尝试实现某种“选项卡”系统，而不使用jqueryui。我猜对了吗？那你到底有什么问题？只需运行一个循环并使用一些字符串连接生成选择器。在第二个

ready

块中

$（“.post0003.empty1”）.html（“”）中的
empty
之后是否真的有
1
？“有人能帮我重新制作函数吗…什么函数不是4等等…”是的。更妙的是，我的价格相当合理添加html。它是Ul和li，带有空div用于表单插入
function(event){
    var postNo = $(this).get('id');
    var postClass = "post000" + postNo.substr(4) 
    var formContent = $("#commentwindow").html();
    $(".empty").html("");
    $("." + postClass+" .empty").html(formContent);
}