在表单中定位不带标签的文本答案

【问题标题】：Target text without tags in a form在表单中定位不带标签的文本
【发布时间】：2022-08-14 08:33:51
【问题描述】：

我在我的网站上使用了一个 WordPress 插件，我有一个表单，其中包含一些我需要更改的文本，基本上是执行查找和替换。问题是表单没有类，文本也没有，但由于这是一个插件，我无法修改实际的插件文件。我只想针对特定页面上的特定表单，所以我想知道如何做到这一点？我找到了创可贴解决方案，但我想知道是否没有更好的方法来做到这一点？

我的代码如下所示：

<?php if (is_page(\"tickets\")) { ?>
    <script type=\"text/javascript\">
        $(\"form\").addClass(\"tickets\");
            
        $(\"form\").contents().filter(function(){
            return this.nodeType === 3
        }).wrap(\'<p />\');
            
        $(\"form p\").text($(\"form p\").text().replace(\"PayPal\", \"\"));
    </script>
<?php } ?>

基本上，这是一个 WordPress 网站，所以is_page 的目标是包含表单的特定页面。 JS 仅在“Tickets”页面上执行。

然后，我在我的表单中添加了一个名为tickets 的类，这样我就可以针对该特定表单进行样式设置。这样我就不会影响我在站点范围内的任何其他表单:-)

我还在 p 标签中包装没有标签的文本。这样，我可以将不带标签的文本作为 JS 和样式的目标。

最后......我的目标是文本（我只是包裹在 p 标签中）并删除单词“PayPal”。

如果可以的话，我尽量远离 JS，因为我知道它会减慢你的页面速度，但我在想，因为我把它缩小到一个特定的页面和一个特定的表单，它可能不会影响事情那么多。

所有这些 JS 都是由我在这里和那里找到的代码拼凑而成的。有一个更好的方法吗

表格如下：

<div>
    <form target=\"_blank\" action=\"https://url.com/wp-admin/admin-post.php?action=add_wpeevent_button_redirect\" method=\"post\">
        <input type=\"hidden\" name=\"cmd\" value=\"_cart\">
        <input type=\"hidden\" name=\"path\" value=\"sandbox.paypal\">
        <input type=\"hidden\" name=\"business\" value=\"seller@url.com\">
        <input type=\"hidden\" name=\"item_name\" value=\"2022 Event Name\">
        <input type=\"hidden\" name=\"custom\" value=\"20681\">
        <input type=\"hidden\" name=\"currency_code\" value=\"USD\">
        <input type=\"hidden\" name=\"no_note\" value=\"1\">
        <input type=\"hidden\" name=\"no_shipping\" value=\"1\">
        <input type=\"hidden\" name=\"notify_url\" value=\"https://url.com/wp-admin/admin-post.php?action=add_wpeevent_button_ipn\">
        <input type=\"hidden\" name=\"lc\" value=\"EN_US\">
        <input type=\"hidden\" name=\"bn\" value=\"WPPlugin_SP\">
        <input type=\"hidden\" name=\"return\" value=\"\">
        <input type=\"hidden\" name=\"cancel_return\" value=\"\">
        <input type=\"hidden\" name=\"upload\" value=\"1\">
    
        <table class=\"main-table_20681\" style=\"width: 100% !important;\">
            <tbody>
                <tr>
                    <td class=\"row-qty\">
                        <select name=\"wpeevent_button_qty_a\">
                            <option value=\"0\">0</option>
                            <option value=\"1\">1</option>
                            <option value=\"2\">2</option>
                            <option value=\"3\">3</option>
                        </select>
                    </td>
                    <td class=\"row-name\">Ticket</td>
                    <td class=\"row-price\">31.50 USD</td>
                    <td class=\"row-desc\">
                        2022 Event Name
                        <input type=\"hidden\" name=\"item_name_1\" value=\"Ticket\">
                        <input type=\"hidden\" name=\"id_1\" value=\"2201\">
                        <input type=\"hidden\" name=\"amount_1\" value=\"31.50\">
                    </td>
                </tr>
            </tbody>
        </table>
        Your eTicket will be sent to your PayPal email address after payment.<br>
        <input class=\"wpeevent_paypalbuttonimage\" type=\"image\" src=\"https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif\" border=\"0\" name=\"submit\" alt=\"Make your payments with PayPal. It is free, secure, effective.\" style=\"border: none;\"><img loading=\"lazy\" alt=\"\" border=\"0\" style=\"border:none;display:none;\" src=\"https://www.paypal.com/EN_US/i/scr/pixel.gif\" width=\"1\" height=\"1\">
    </form>
</div>

谢谢，
乔什

我会使用 <span> 而不是 <p> 因为后者是块元素
我能做到！谢谢！！还有其他建议吗？

标签： javascript php css

【解决方案1】：

我最终使用了@Vinay 的建议……谢谢@Vinay！

所以现在，代码看起来像：

<?php if (is_page("tickets")) { ?>
    <script type="text/javascript">
        $("form").addClass("tickets");
        
        $("form").contents().filter(function(){
            return this.nodeType === 3
        }).wrap('<span />');
        
        $("form span").text($("form span").text().replace("PayPal", ""));
    </script>
<?php } ?>

【讨论】：