在 jquery 中调用类方法

Question

嘿，我正在尝试构建一个简单的库存程序。我有这样的课：

    <?php
    class category
    {
    public static $catoptSupplies=array(
        "Cleaning Supplies",
        "Guest Supplies",
        "Printing Supplies"
        );
    public static function loopcat3()
        {
            $loop3=category::$catoptSupplies;
            $spnum=1;
            foreach ($loop3 as $prnloop3) 
            {   
                echo "<option value='spcat$spnum'>$prnloop3</option>";
                $spnum++;

            }
        }

    }

?>

现在我想在我的表中添加包含如下选择选项的行：

 <script>
    $(document).ready(function(){
        var count=1;
        $('#addMsGDRow').click( function(){
            count = count+1;
            var addMsGDRow ='<tr id="row'+count+'">\
                                    <td>\
                                        <select style="font-size: 12px; width: 83%; text-align: center;">\
                                            <option>--Choose Category--</option>\
                                            <?php echo category::loopcat3(); ?>
                                        </select>\
                                    </td>\
                                    <td>\
                                        <select style="font-size: 12px;  text-align: center;">\
                                            <option>Unit</option>\
                                            <option>Meter</option>\
                                            <option>Pcs</option>\
                                        </select>\
                                    </td>\
                                    <td><input type="text" name="" style="width: 70px;"></td>\
                                    <td><input type="text" name="" style="width: 140px;"></td>\
                                    <td>\
                                        <textarea style="width: 121px; height: 43px;"></textarea>\
                                    </td>\
                           <td><input type="number" name="" style="width: 75px;" min="0"></td>\
                           <td><input type="number" name="" min="0" style="width: 100px;"></td>\
                           <td><input type="number" name="" min="0" style="width:140px;"></td>\
                           <td><button type="button" name="remove" data-row="row'+count+'" class="btn btn-danger btn-xs removemsgd">-</button></td>\
                                </tr>';
            $('#tableMsGoods').append(addMsGDRow);
        });
        $(document).on('click', '.removemsgd', function(){

          var delete_row=$(this).data("row");
          $('#'+delete_row).remove();

      }); 
    });
</script>

但如果使用普通 php 行调用我的类，则不会添加新行。但是，如果我删除 php 行，它确实会添加一个新行。那么，如何在 jquery 中调用我的类？

Answer 1

调用了静态PHP函数是，但问题是它返回一个带单引号的字符串，这恰好是您在JavaScript中使用的字符串分隔符，因此JS字符串文字终止于一个你不希望它结束​​的地方。此外，您在 JS 字符串文字的每一行都使用了行继续符 \，但不是在 PHP 生成的内容之后，这样也会破坏字符串文字。

最简单的解决方案是在 JS 中使用反引号字符来分隔你的字符串，这样它就变成了一个模板字面量。这样你也不需要换行符。

像这样：

var addMsGDRow = `
    <tr id="row'+count+'">
        <td>
            <select style="font-size: 12px; width: 83%; text-align: center;">
                <option>--Choose Category--</option>
                <?php echo category::loopcat3(); ?>
            </select>
        </td>
        <td>
            <select style="font-size: 12px;  text-align: center;">
                <option>Unit</option>
                <option>Meter</option>
                <option>Pcs</option>
            </select>
        </td>
        <td><input type="text" name="" style="width: 70px;"></td>
        <td><input type="text" name="" style="width: 140px;"></td>
        <td>
            <textarea style="width: 121px; height: 43px;"></textarea>
        </td>
        <td><input type="number" name="" style="width: 75px;" min="0"></td>
        <td><input type="number" name="" min="0" style="width: 100px;"></td>
        <td><input type="number" name="" min="0" style="width:140px;"></td>
        <td><button type="button" name="remove" data-row="row'+count+'" class="btn btn-danger btn-xs removemsgd">-</button></td>
    </tr>`;