Jquery 如果输入为空，则设置范围值

我想验证这个表单，如果相应的输入值为空，则设置span的值。但是，

.sibbines（）

和

.next（）

不起作用

$（'cf#u submit'）。在（“单击”，函数（e）{
e、 预防默认值（）；
validateForm（）；
});
函数validateForm（）{
如果（$（'#cf_name'）.val（）|$（'#cf_email'）.val（）=''）{
//$（'.calc_error'）.text（'Required'）；//这很有效
$（this）.sides（'.calc_error'）.text（'Required'）；//不起作用
//$（this）.parent（“div”）.children（'span'）.text（'Required'）//不起作用
}
}

名称


电子邮件

美元的范围（这）就是问题所在。查看随附的屏幕截图，检查控制台中的相关范围。

我准备了一个带有工作代码的CopedPen。只是不使用$（this）.sibbins（），而是使用$（'.calc_error'）来标识要更改的对象

$（this）的范围就是问题所在。查看随附的屏幕截图，检查控制台中的相关范围。

我准备了一个带有工作代码的CopedPen。只是不使用$（this）.sibbins（），而是使用$（'.calc_error'）来标识要更改的对象

---

validateForm

正在使用“错误的”

此

它是从submit按钮调用的，因此它最多只能表示该按钮，而不是实际的输入

在这种情况下，validateForm是从另一个函数调用的。因此，它甚至不知道提交

这个
。在这种情况下，它表示
窗口

作为解决方案，您可以将if分为两个if：

如果cf#u name出现问题，则$（'#cf#u name'）。同级（'.calc_error'）。text（'Required'）

如果cf#u电子邮件出现问题，则$（''cf#u email'）。同级（'.calc_error'）。文本（'Required'）
验证表单
正在使用“错误的”
此

它是从submit按钮调用的，因此它最多只能表示该按钮，而不是实际的输入
在这种情况下，validateForm是从另一个函数调用的。因此，它甚至不知道提交
这个
。在这种情况下，它表示
窗口

作为解决方案，您可以将if分为两个if：

如果cf#u name出现问题，则$（'#cf#u name'）。同级（'.calc_error'）。text（'Required'）

如果cf#u电子邮件出现问题，则$（''cf#u email'）。同级（'.calc_error'）。文本（'Required'）
.sides（）工作得很好。但我认为css选择器是您的问题所在。
即$（this）.sides表示窗口元素的同级。
因此，请尝试以下代码

Jquery

$('#cf_submit').on("click", function(e) {
  e.preventDefault();
  validateForm();
});

function validateForm() {
  $('.calc_input').each(function() {
    if ($(this).val() == "") {
      $(this).siblings('.calc_error').text('* required');
    } else {    
      $(this).siblings('.calc_error').text('');
    }
  }); 
}

CSS

下面是正在工作的JSFIDLE:
.sibbins（）工作得很好。但我认为css选择器是您的问题所在。
即$（this）.sides表示窗口元素的同级。
因此，请尝试以下代码

Jquery

$('#cf_submit').on("click", function(e) {
  e.preventDefault();
  validateForm();
});

function validateForm() {
  $('.calc_input').each(function() {
    if ($(this).val() == "") {
      $(this).siblings('.calc_error').text('* required');
    } else {    
      $(this).siblings('.calc_error').text('');
    }
  }); 
}

CSS

这是正在工作的JSFIDLE:
您的validateFrom是否知道此上下文？调用函数时，
this
的值是多少？您正在通过单击提交按钮调用它，但如果您尝试，它甚至不会是该按钮。作为一种解决方案，您可以将
if
分为两个if:
if cf_name problem THEN$（'cf#u name'）。同胞（'.calc_error'）。text（'Required'）；如果cf#u电子邮件出现问题，则$（'#cf#u电子邮件'）。兄弟姐妹（'.calc_错误'）。文本（'Required'）$（'cf#u name'）.val而不是
$（'cf#u name'）.val（）
（缺少括号）。谢谢。这就是答案。你能把这个作为答案贴出来吗？好的（）。很高兴我能帮上忙。您的validateFrom是否知道此上下文？调用函数时，
this
的值是多少？您正在通过单击提交按钮调用它，但如果您尝试，它甚至不会是该按钮。作为一种解决方案，您可以将
if
分为两个if:
if cf_name problem THEN$（'cf#u name'）。同胞（'.calc_error'）。text（'Required'）；如果cf#u电子邮件出现问题，则$（'#cf#u电子邮件'）。兄弟姐妹（'.calc_错误'）。文本（'Required'）$（'cf#u name'）.val而不是
$（'cf#u name'）.val（）
（缺少括号）。谢谢。这就是答案。你能把这个作为答案贴出来吗？好的（）。很高兴我能帮上忙。谢谢你的回复。看来你误解了。请再次查看我的代码片段。我可以用那个代码让它工作。但是，我只希望它在相应的输入字段为空时显示。谢谢您的回复。看来你误解了。请再次查看我的代码片段。我可以用那个代码让它工作。但是，我只希望它在相应的输入字段为空时显示。
span {
  color: red;
}