0

我正在为 wordpress 开发一个前端表单，并wp_editor在表单中添加了文本区域，下面是我添加的代码。有什么方法可以将此字段标记为必填字段，就像 HTML5 必填参数一样？

<?php
    $settings = array(
    'wpautop' => false,
    'media_buttons' => true,
    'textarea_rows' => 5,
    'tinymce' => true,
    'teeny' => true,
    'textarea_name' => 'main_Content',
    'quicktags' => false,
    'editor_height' => 300
);

    $content = '';
    $editor_id = 'main_Content';

    wp_editor(stripslashes($content), $editor_id, $settings);
?>
4

2 回答 2

2

对于在管理屏幕上使用多个可视化编辑器（仅需要其中一些）的插件，我已成功完成以下操作。

  1. 创建编辑器时，添加一个对我的插件唯一的类，并指示此编辑器中需要内容。
  2. 将函数连接到“the_editor”。
  3. 此函数将检查编辑器的标记是否包含我的自定义类。如果是这样，它会添加必需的属性。

我可以使用

textarea[required]:invalid

如果在此字段为空时提交表单，则会生成错误（尽管到目前为止我只在 Safari 10.1 中测试过）。

示例代码如下（此代码取自一个更大的类）。首先，摘自构建编辑器的函数。

$addlClass = ($required) ? 'my-required-field' : '';
$settings  = array(
  'media_buttons' => false,
  'textarea_name' => $fieldName,
  'editor_class'  => $addlClass
);
wp_editor($cleanFld, $fieldId, $settings);

然后，我的钩子：

add_action('the_editor', array($this, 'CheckIfEditorFieldIsRequired'));

最后，该功能：

public function CheckIfEditorFieldIsRequired($editorMarkup)
{
  if (stripos($editorMarkup, 'my-required-field') !== false) {
    $editorMarkup = str_replace('<textarea', '<textarea required', $editorMarkup);
  }
  return $editorMarkup;
}
于 2017-08-09T23:22:03.027 回答
1

可视化编辑器不是文本区域，它是 iframe，因此即使您可以设置属性，它也不会执行任何操作。您可以在将发送到服务器的隐藏文本区域上设置属性，但由于它是隐藏的，我不确定如何显示关于它未填充的警报，并且浏览器之间可能会有所不同（它是隐藏的，所以有没有用于显示警报的明显视觉锚点）

要不然

您可以在编辑器 html 中添加过滤器

add_filter( 'the_editor', 'add_required_attribute_to_wp_editor', 10, 1 );

function add_required_attribute_to_wp_editor( $editor ) {
    $editor = str_replace( '<textarea', '<textarea required="required"', $editor );
    return $editor;
}
于 2016-09-29T09:16:02.877 回答