Wordpress - 所需复选框未验证

Question

我正在尝试勾选一个复选框，以便继续进入下一页。我正在functions.php 内部进行开发。 Functions.php 是否不允许常规 HTML 标签内的必需内容？

这是我到目前为止所拥有的：

add_action('web_hook', 'test_button', 10);

function test_button() {
    // required does not seem to do anything
    echo '
    <form>
        <input type="checkbox" name="Check1" id="Check1" value="Check1" value="yes" required> 
        <label>this is the first checkbox</label>
    </form>
    ';

// test to see if page direct stops if checkbox not ticked
echo '<a href="https://someurl.com" >Click this to proceed</a>';


    echo '<br>';
}

Answer 1

PHP 用于生成 HTML。让我们看看带有必需复选框的正确 HTML。我认为您缺少提交按钮。这将处理表格。

如果您想处理页面卸载（例如单击链接时），则有点不同，您需要使用 javascript 处理事件

beforeunload

。

两种方法相结合，您需要选中复选框才能继续或取消。

function isChecked() {
  return document.getElementById("Check1").checked
}

window.addEventListener('beforeunload', function(ev) {
  if (!isChecked()) {
    ev.preventDefault();
    ev.returnValue = '';
  }
})

<form>
  <label>
  <input type="checkbox" name="Check1" id="Check1" value="Check1" value="yes" required>
  this is the first checkbox</label>

  <button>continue</button>
</form>

<a href="https://example.com">outer link</a>