在javascript中为点击功能制作数组

Question

在我的网络上，我有许多用于管理点击功能的按钮。 每个按钮单击都有一个类，用于初始化每个按钮。 这里的代码

<script type="text/javascript">
$(document).ready(function(){
    $(".data1").click(function(){
        $("#line").val("1");
        $("#pkategori").val("-Kategori Produk-");
        $("#pname").val("-Nama Produk-");
        $("#pnumber").val("");
        $("#seri").val("");
        $("#quantity").val("");
        $("#ok").hide();
        $("#cancel").hide();
        $("#tnposisi").hide();
        $("#nposisi").hide();
        $("#tketp").hide();
        $("#ketp").hide();
        $("#tpjumlah").hide();
        $("#pjumlah").hide();
        $("#editsave").hide();
        $("#editcancel").hide();
        $("#input").hide();
        $("#loading").hide();
        $("#status").html("");
    });
});

对于我当前的网站，我一个接一个地直到$(".data160").click(function() 。它将是长代码而无效。我的问题，如何制作一个简单的代码？

Answer 1

将它与几个功能分开：

1，val和html在一起

2，隐藏在一起，你可以创建这样的功能

    function hideEl(el){
      $('#'+el).hide();

    }
   var arrEls = ['pname','apple','msn'...];
   $(arrEls).each(function(key,value){
      hideEl(value);
   });

Answer 2

为所有按钮提供相同的类，并为不同的功能使用数据属性。

<button class="data" data-line="1" data-kategory="-Kategori Produk-" data-name="-Nama Produk-">

然后写：

$(".data").click(function(){
    $("#line").val($(this).data("line"));
    $("#pkategori").val($(this).data("kategori"));
    $("#pname").val($(this).data("name"));
    $("#pnumber,#seri,#quantity").val("");
    $("#ok,#cancel,#tnposisi,#nposisi,#tketp,#ketp,#tpjumlah,#pjumlah,#editsave,#editcancel,#input,#loading").hide();
    $("#status").html("");
});

一次处理它们。