如何验证wordpress中的类别和标签字段？

Question

我正在为 wordpress 帖子创建验证，这意味着用户不应该能够提交带有空白字段的帖子。

这里是用于验证标题和内容字段的 jquery，但我无法验证标签和类别字段，用户应该无法提交空白类别和空白标签。谁能帮助如何使用 jquery 验证 wordpress 中的类别和标签字段。categories and tags

jQuery(document).ready(function() {
    // publish button validation
    jQuery('#publish').click(function(){
        $title_value = jQuery.trim(jQuery('#title').val());
        if($title_value == 0 && $title_value != " "){
            alert('please insert title');
            jQuery('.spinner').css("visibility", "hidden");
            jQuery('#title').focus();
            return false;
        }

        $content_value = jQuery.trim(jQuery('#content').val());
        if($content_value == 0 && $content_value != " "){
            alert('Please insert content');
            jQuery('.spinner').css("visibility", "hidden");
            jQuery('#content').focus();
            return false;
        }
    });

Answer 1

使用 JQuery，您可以获取类别容器并计算检查的输入数量。

$("#myButton").on("click", function() {
  /* CATEGORY */
  // Get all the checkbox checked in your category container
  var arrayChecked = $("#categorydiv input:checked");
  alert( arrayChecked.length );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="categorydiv" class="postbox ">
	<div class="handlediv" title="Click to toggle">
	<br />
	</div>
	<h3 class="hndle ui-sortable-handle"><span>Categories</span></h3>
	<div class="inside">
		<div id="taxonomy-category" class="categorydiv">
			<ul id="category-tabs" class="category-tabs">
				<li class="tabs"><a href="#category-all">All Categories</a></li>
				<li class="hide-if-no-js"><a href="#category-pop">Most Used</a></li>
			</ul>

			<div id="category-pop" class="tabs-panel" style="display: none;">
				<ul id="categorychecklist-pop" class="categorychecklist form-no-clear">
					<li id="popular-category-1" class="popular-category">
						<label class="selectit">
							<input id="in-popular-category-1" type="checkbox" value="1">
							Uncategorized
						</label>
					</li>
				</ul>
			</div>

			<div id="category-all" class="tabs-panel">
				<input type="hidden" name="post_category[]" value="0">
				<ul id="categorychecklist" data-wp-lists="list:category" class="categorychecklist form-no-clear">
					<li id="category-2">
						<label class="selectit"><input value="2" type="checkbox" name="post_category[]" id="in-category-2"> new</label>
					</li>
					<li id="category-6"><label class="selectit">
						<input value="6" type="checkbox" name="post_category[]" id="in-category-6"> news</label>
					</li>
					<li id="category-1" class="popular-category">
						<label class="selectit"><input value="1" type="checkbox" name="post_category[]" id="in-category-1"> Uncategorized</label>
					</li>
				</ul>
			</div>
			<div id="category-adder" class="wp-hidden-children">
				<h4>
					<a id="category-add-toggle" href="#category-add" class="hide-if-no-js">+ Add New Category</a>
				</h4>
				<p id="category-add" class="category-add wp-hidden-child">
					<label class="screen-reader-text" for="newcategory">Add New Category</label>
					<input type="text" name="newcategory" id="newcategory" class="form-required form-input-tip" value="New Category Name" aria-required="true">
					<label class="screen-reader-text" for="newcategory_parent">Parent Category:</label>
					<select name="newcategory_parent" id="newcategory_parent" class="postform">
						<option value="-1">— Parent Category —</option>
						<option class="level-0" value="2">new</option>
						<option class="level-0" value="6">news</option>
						<option class="level-0" value="1">Uncategorized</option>
					</select>
					<input type="button" id="category-add-submit" data-wp-lists="add:categorychecklist:category-add" class="button category-add-submit" value="Add New Category">
					<input type="hidden" id="_ajax_nonce-add-category" name="_ajax_nonce-add-category" value="feff2a33c3">
					<span id="category-ajax-response"></span>
				</p>
			</div>
		</div>
	</div>
</div>
<button id="myButton">Validate</button>

对于标签，我需要一个标签的HTML代码，看看如何匹配。

编辑：标签解决方案

$("#myButton").on("click", function() {
  var tagsArray = $("#tagsdiv-post_tag .tagchecklist > span");
  alert( tagsArray.length );
});

$(".ntdelbutton").on("click", function() {
  $(this).closest("span").remove();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="tagsdiv-post_tag" class="postbox ">
	<div class="handlediv" title="Click to toggle">
		<br>
	</div>
	<h3 class="hndle ui-sortable-handle"><span>Tags</span></h3>
	<div class="inside">
		<div class="tagsdiv" id="post_tag">
			<div class="jaxtag">
				<div class="nojs-tags hide-if-js">
					<p>Add or remove tags</p>
					<textarea name="tax_input[post_tag]" rows="3" cols="20" class="the-tags" id="tax-input-post_tag"></textarea>
				</div>
				<div class="ajaxtag hide-if-no-js">
					<label class="screen-reader-text" for="new-tag-post_tag">Tags</label>
					<div class="taghint">Add New Tag</div>
					<p>
						<input type="text" id="new-tag-post_tag" name="newtag[post_tag]" class="newtag form-input-tip" size="16" autocomplete="off" value="">
						<input type="button" class="button tagadd" value="Add">
					</p>
				</div>
				<p class="howto">Separate tags with commas</p>
			</div>
			<div class="tagchecklist">
				<span><a id="post_tag-check-num-0" class="ntdelbutton">X</a>&nbsp;tag</span>
				<span><a id="post_tag-check-num-1" class="ntdelbutton">X</a>&nbsp;tag1</span>
				<span><a id="post_tag-check-num-2" class="ntdelbutton">X</a>&nbsp;tag2</span>
			</div>
		</div>
		<p class="hide-if-no-js">
			<a href="#titlediv" class="tagcloud-link" id="link-post_tag">Choose from the most used tags</a>
		</p>
	</div>
</div>
<button id="myButton">Validate</button>

Answer 2

您可以通过 ACF 指定标签和类别来做到这一点，

从后端创建一个新的自定义字段，

选择字段类型 -> 分类，

帖子类型 -> 帖子，

分类 -> 类别，

允许空值？ -> 不，

对 post_tag 执行相同操作。