Javascript 强制设置txt框或变量的长度

我有一些javascript代码。我想进行一些错误检查，但不知道从哪里开始。 我想，如果val1的内容长度不完全是21个字符，停止脚本，或者最好还是给事实一个消息框。 或者可以强制输入框包含21个字符？ 对不起，如果这是一个愚蠢的问题，但我是新的，这仍然在学习

我将输入框的大小设置为21，但这只会增加尺寸，因此仍然可以输入更多或更少的字符。 我想也许某种if语句可以做到这一点，但不知道如何做到这一点，我的尝试也没有成功

<script type='text/javascript'>
function screenshot(){
  html2canvas(document.body).then(function(canvas) {

    // Get base64URL
    var base64URL = canvas.toDataURL('image/jpeg').replace('image/jpeg', 'image/octet-stream');
    var val1 = $('#datepicker').val();

    // AJAX request
    $.ajax({
       url: 'ajaxfile.php',
       type: 'post',
       //data: {image: base64URL, name: datepicker},
       data: {image: base64URL, datepicker: val1},
       success: function(data){
       console.log('Upload successfully');
       }
    });
  });
}
</script>

---

这很简单。第一次查找val1变量的长度

>> var val1_length = val1.value.length;

然后使用条件检查长度是否为21

---

您缺少的是对

val1

值的简单检查，因此脚本将完全执行。这就是你在JS中所寻找的：

var val1 = $('#datepicker').val();

if (val1.length !== 21) {
  // AJAX request
  $.ajax({
   url: 'ajaxfile.php',
   type: 'post',
   //data: {image: base64URL, name: datepicker},
   data: {image: base64URL, datepicker: val1},
   success: function(data){
   console.log('Upload successfully');
   }
})}

---

另一种方法是，如果

#datepicker

输入类型为

text

，则可以在此元素上设置

maxlength

属性，因此输入的字符数不可能超过设置的字符数。

我已经解决了这个问题。最后，我决定在JavaScript中使用一个函数，而不是ajax代码。imo称，这是一个更加优雅的解决方案，它将确保用户知道需要输入哪些数据（以及使用日期选择器日历）

---

谢谢你，纳雷什。我试过了，并更新了我原来的帖子，但不适合我。可能是我的错，放错了位置。谢谢亚当，我将maxlenght和minlength设置为21，但它们仍然可以放更少的字符（但是框会变红，所以会保持不变）。因此，他们仍然可以将格式不正确（字符太少）的图像上载到服务器。然后，请在devtools中检查是否发送了post请求，如果是，响应是什么，这可能是相关问题。另外，请尝试调试/console.log以检查

val1_lengh

的值，您在那里丢失了我。相关吗？所谓相关（后端），我的意思是，如果ajax调用，

axajfile.php

，而您在DB中看不到预期的结果，那么您处理发送的数据的方式就有问题了。好的，谢谢。别这么想。在我尝试将代码添加到测试字符串长度之前，它工作得非常完美。稍后我会做一些实验。我已经查看了devtools，但是没有发送帖子。错误始终为：ReferenceError:val1_未定义长度。如果我在html2canvas（document.body）之后启动if语句，然后（函数（canvas）{（但在这里它首先执行canvas代码），或者如果我将它放在函数screenshot（）之后，则会发生这种情况。{它停止运行而不执行任何代码。

>> var val1_length = val1.value.length;

 if(val1_length != 21)
        {
            alert("please enter 21 character ....");
        }
    else
    {
        // Your code if value contain 21 charcter
    }

var val1 = $('#datepicker').val();

if (val1.length !== 21) {
  // AJAX request
  $.ajax({
   url: 'ajaxfile.php',
   type: 'post',
   //data: {image: base64URL, name: datepicker},
   data: {image: base64URL, datepicker: val1},
   success: function(data){
   console.log('Upload successfully');
   }
})}

function ValidateDate()
{
var datepicker = document.getElementById('datepicker').value;
var FullDate = 21;   

  if (datepicker.length !== FullDate) {
  {
    alert("The Date Must Have a Start *and* End Date. Use the Calendar to Ensure this. Do Not enter any other text in the Box!");
    document.getElementById("datepicker").focus();
    return false;
  }
  } else {
    screenshot();      
  }
}