HTML组件

HTML表单项

HTML表单项组件,用于在表单中插入自定义的HTML内容,可用于显示提示信息、说明文字或自定义布局。

用法示例

<?php
use plugin\xbCode\builder\Builder;
use plugin\xbCode\builder\Renders\Form;

// 创建表单
Builder::form(function (Form $builder) {
  // 添加简单HTML提示
  $builder->addRowHtml('<div class="alert alert-info">请仔细填写以下信息</div>');
  
  // 添加带样式的HTML内容
  $builder->addRowHtml('
    <div style="padding: 15px; background: #f5f5f5; border-radius: 4px;">
      <h4 style="margin-top: 0;">重要提示</h4>
      <ul>
        <li>请确保信息的准确性</li>
        <li>必填项不能为空</li>
        <li>提交后不可修改</li>
      </ul>
    </div>
  ');
  
  // 添加分隔线
  $builder->addRowHtml('<hr style="margin: 20px 0; border-color: #ddd;">');
  
  // 添加富文本说明
  $builder->addRowHtml('
    <div class="form-description">
      <p><strong>填写说明:</strong></p>
      <p>1. 用户名长度为3-20个字符</p>
      <p>2. 密码必须包含字母和数字</p>
      <p>3. 邮箱格式必须正确</p>
    </div>
  ');
  
  // 添加图片
  $builder->addRowHtml('<img src="/images/banner.jpg" alt="提示" style="width: 100%; max-width: 600px;">');
  
  // 添加视频
  $builder->addRowHtml('
    <video width="100%" controls>
      <source src="/videos/tutorial.mp4" type="video/mp4">
      您的浏览器不支持视频播放
    </video>
  ');
});

组件参数

参数名类型默认值说明
htmlstring-HTML内容,必填

使用说明

  1. 基本使用:通过 addRowHtml() 方法添加HTML内容,参数为HTML字符串
  2. 内容类型:支持任意有效的HTML标签和内容
  3. 样式控制:可以使用内联样式或CSS类名来控制显示效果
  4. 安全性:HTML内容会被直接渲染,请确保内容来源可信,避免XSS攻击


常见用途

  • 显示表单说明和提示信息
  • 添加分隔线和空白区域
  • 插入图片、视频等媒体内容
  • 展示格式化的文本内容
  • 创建自定义布局结构

注意事项

  • HTML内容不会被转义,需要自行处理特殊字符
  • 不要包含可执行的JavaScript代码
  • 建议使用简单的HTML结构,避免复杂的嵌套