不带表单标签的输入类型

Question

它似乎只有在输入类型是表单时才有效。是否可以通过 javascript 进行验证而不使用表单标签？ 预期：如果文本字段为空并且我单击提交它应该会出现该字段为空的消息。仅在字段为字段外时提交

我的脚本：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tr><td><input type="text" size"30" placeholder="put id"  id="source" required>
<button type="submit" class="formButton" id="submit">Submit</button></td></tr>
<tr><td><input type="text" style="border:none" size="40" id="target" class="form" onClick="myFunct()" required></td></tr>
<tr><td><input type="text" style="border:none" size="40" id="target" class="form21" onClick="myFunct()" required></td></tr>

<script>
$(".formButton").click(function() {
 $(".form21").show();
});
</script>

<script>
$('#submit').click(function(){
 var source = $('#source').val();
$('#target').val('text' + ' text');
}); 
</script>

我累了，但接缝不工作

<script>
function  myFunct(){
if (document.getElementById('source').validity.valid) { alert('missing name'); return }
</script>

感谢您的帮助

Answer 1

1. $('#target').val('text + ' text'); ，引号没有正确关闭，没有文本变量。

所以这应该是$('#target').val('text' + source );

1. 在 myFunct 中，函数没有右大括号。

2. ID 对于页面是唯一的。所以不要对多个元素使用相同的 ID。在这个例子中，目标被使用了两次。

3. 注册元素的有效性，当元素无效时，valid属性为false。所以对于警报消息，条件应该是(!document.getElementById('source').validity.valid)（即检查元素是否无效有效。

4. 提交按钮的点击处理程序不调用 myFunct 函数。因此，使用当前代码，当输入元素具有类 "form" 和 "form21" 时，将调用验证器函数。如果您希望在提交单击时完成验证，则应为按钮提交单击处理程序提供验证代码。