如何使用javascript隐藏表单的选项

How to hide options of a form with javascript

本文关键字：选项 表单 隐藏 何使用 javascript      更新时间：2023-09-26

>我有一个特殊的问题。我正在使用一个主题，该主题使用分类法将用户帖子分配给用户的董事会。因此，每个用户都可以创建自己的看板并将他的帖子分配给一个看板。我正在使用wordpress前端上传器，并且可以将带有下拉列表的分类板添加到表单中。这工作正常。

我只有一个问题。用户可以在下拉列表中选择每个人的看板。

分类结构如下所示：

Parent: User ID 
Child: boardname

所以我的输出看起来像这样：

<div class="wpuf-fields wpuf_board_select_123_321">
<select data-required="yes" data-type="select" name='board[]' id='board[]' class='board wpuf_board_123' >
    <option value='-1'>&#8212; Select &#8212;</option>
    <option class="level-0" value="3">1</option>            // value is term ID // Content is User ID // parent
    <option class="level-1" value="17">User Board </option> // value is term ID // Content is Boardname
    <option class="level-1" value="26">User Board</option>  // value is term ID // Content is Boardname
    <option class="level-1" value="106">User Board</option> // value is term ID // Content is Boardname
    <option class="level-1" value="62">User Board</option>  // value is term ID // Content is Boardname
    <option class="level-1" value="148">User Board</option> // value is term ID // Content is Boardname
    <option class="level-0" value="191">10</option>         // value is term ID // Content is User ID // User has no boards
    <option class="level-0" value="193">11</option>         // value is term ID // Content is User ID // User has no boards
    <option class="level-0" value="10">2</option>           // value is term ID // Content is User ID // parent
    <option class="level-1" value="123">User Board</option> // value is term ID // Content is Boardname
    <option class="level-1" value="124">User Board</option> // value is term ID // Content is Boardname
    <option class="level-1" value="192">User Board</option> // value is term ID // Content is Boardname
    <option class="level-1" value="121">User Board</option> // value is term ID // Content is Boardname
    <option class="level-1" value="155">User Board</option> // value is term ID // Content is Boardname
    <option class="level-0" value="226">20</option>         // value is term ID // Content is User ID // User has no boards
</select>
</div>

所以这就是我到目前为止所做的：

 $board_parent_id = get_user_meta($user_id, "_Board Parent ID", true);
 $board_children_count = wp_count_terms("board", array( "parent" => $board_parent_id));

我的想法是用添加"隐藏"的javascript隐藏不需要的选项。所以我已经必须父母 ID 和孩子计数，我现在正在挣扎，如何走得更远。

我希望这里有人可以帮助我找到解决方案。

提前感谢！

我不清楚用户是否正在使用 wp-admin。但是，我假设您的问题发生在 wp-admin 中。

要使用javascript隐藏，您可以执行以下操作：

// Add to footer on admin a function to exec the scripts
add_action('admin_footer', 'my_custom_scripts');
// The function
function my_custom_scripts() {
    // An array of IDs that must be removed
    $itemsIdsToHide = array("121", "226", "123");
    // Create a string to convert the PHP array to JS array
    $strJavascriptArray = "Array('" . implode("','", $itemsIdsToHide) . "')";
    ?>
    <script>
        // Echoes the javascript array created in PHP
        var arr = <?php echo $strJavascriptArray; ?>;
        // Loop into each item of select.
        // BE SURE TO QUERY ONLY THE SELECT YOU NEED
        jQuery('select>option').each(function() {
            // IF the option ID is in the array to remove, remove the item
            if(arr.indexOf($(this).attr("value")) > -1) {
                $(this).remove();
            }
        });
    </script>
    <?
}

希望对:)有所帮助

相关文章：