Javascript 在将调用第一个函数的第二个函数中调用第一个函数

我需要调用addCustomer函数，它将从addCustomer函数中调用validateItems函数。当我点击addPatron按钮时，它应该提交表单，除非没有输入数据。但是我遇到了麻烦，因为当点击按钮而不添加信息时，我会收到错误消息，但是当我输入信息时，错误消息仍然保留在那里，表单不会提交。我不确定我是否正确地从ValidateItem函数调用addPatron函数。请帮忙。这是代码

var $ = function (id) {
  return document.getElementById(id)
}

var validateItems = function () {
  addpatron()

  var isValid = true

  var firstName = $('firstname').value
  $('firstname').focus() // puts crusor on field

  if (firstName == '') {
    $('firstnameerror').innerHTML = 'Enter First Name'
    isValid = false
  }

  var lastName = $('lastname').value

  if (lastName == '') {
    $('lastnameerror').innerHTML = 'Enter Last Name'
    isValid = false
  }

  var myEmail = $('email').value

  if (myEmail == '') {
    $('emailerror').innerHTML = 'Enter Email'
    isValid = false
  }

  var myCity = $('city').value

  if (myCity == '-') {
    $('cityerror').innerHTML = 'Select a City from the list'
    isValid = false
  }

  var myDonation = $('donation').value

  if (myDonation == '') {
    $('donationerror').innerHTML = 'Enter Donation Amount'
    isValid = false
  } else if (isNaN(myDonation)) {
    $('donationerror').innerHTML = 'Amount must be numeric'
    isValid = false
  }

  return isValid
}

var addpatron = function () {
  var isValid = validateItems

  if (isValid == true) {
    $('myform').submit()
  } else {
    $('endmessage').innerHTML = 'Patron Not Added!'
  }
}

var clearfields = function () {
  firstname.value = ''
  lastname.value = ''
  email.value = ''
  city.value = '-'
  donation.value = ''

  firstnameerror.innerHTML = ''
  lastnameerror.innerHTML = ''
  emailerror.innerHTML = ''
  cityerror.innerHTML = ''
  donationerror.innerHTML = ''
  endmessage.innerHTML = ''
}

window.onload = function () {
  $('validateItems').onclick = addPatron
  $('firstname').focus() // puts the crusor on field
  $('clearfields').onclick = clearfields
}

---

您不需要在

validateItems

中调用

addPatron

，但需要在

addPatron

中调用

validateItems

：-）

---

威尔·詹金斯是对的

而且，您的CSS选择器是错误的。我认为您的目的是查找具有属性

id=“firstname”

，

id=“firstnamererror”

等的html元素。在CSS选择器中，

意味着按id查找元素，所以您确实需要

$（“#firstname'）

等

看起来您不理解jquery。Jquery对象与原始DOM元素不同，原始DOM元素记录在。原始DOM元素是可从浏览器脚本获得的最低级别的DOM接口。Jquery是建立在它之上的库。jquery对象表示一个DOM元素（或者多个元素，或者可能一个也没有）。但是jquery对象上可用的方法与您试图使用的原始DOM元素上可用的方法完全不同。请注意，由于jquery对象不能表示任何对象，因此当遇到无法匹配DOM中任何元素的CSS选择器时，jquery不会引发异常

围绕这一点有不同的方法。您可以完全接受jquery，使用jquery中可用的所有方法，而不是您所学的方法。例如，

$（'validateItems'）。onclick=addPatron

将成为

$（'validateItems'）。单击（addPatron）

。有关更多详细信息，请参见jquery.com。或者你可以使用原始的DOM

您也可以将这两种方法混合使用，只要您不混淆这两种方法。例如，我认为jquery对象可以像原始DOM元素数组一样被取消引用，即

$（“#firstname”）[0]

将是第一个（也是唯一一个）id为

firstname

的DOM元素。这意味着您可以像对待任何DOM元素一样对待它；例如，

var firstName=$（'#firstName'）[0]。value

。（尽管令人恼火，但我在文档中找不到这一点。）相反，如果

element

是一个原始DOM元素，那么

$（element）

是一个包含该元素（而不是其他元素）的jquery对象

---

使用原始DOM元素很难处理。方法名很长，并且不同浏览器之间存在不一致的问题（尽管我怀疑这并不像以前那么糟糕）。我认为Jquery更好。但是jquery现在也相当过时了。更现代的stuff使用诸如React之类的库，它使用了一种不同的范例，旨在避免忘记更新页面的某些部分等问题。

当我单击按钮提交表单时，如果没有输入数据，则不会显示结束消息此答案删除了最后两个函数定义（

clearfields

和

window.onload

），但我认为这是为了简洁起见，这些函数仍然应该包括在内。你删除了吗？还有，控制台中是否有任何错误消息？（在大多数浏览器中按F12）。我被告知我的$（“addpatron”）.onclick=validateItems；不正确，因为它调用validateItems函数，但我应该调用addCustomer函数，它将从其中调用validateItem函数

var validateItems = function () {
  // addpatron() // don't call this

  var isValid = true

  var firstName = $('firstname').value
  $('firstname').focus() // puts crusor on field

  if (firstName == '') {
    $('firstnameerror').innerHTML = 'Enter First Name'
    isValid = false
  }

  var lastName = $('lastname').value

  if (lastName == '') {
    $('lastnameerror').innerHTML = 'Enter Last Name'
    isValid = false
  }

  var myEmail = $('email').value

  if (myEmail == '') {
    $('emailerror').innerHTML = 'Enter Email'
    isValid = false
  }

  var myCity = $('city').value

  if (myCity == '-') {
    $('cityerror').innerHTML = 'Select a City from the list'
    isValid = false
  }

  var myDonation = $('donation').value

  if (myDonation == '') {
    $('donationerror').innerHTML = 'Enter Donation Amount'
    isValid = false
  } else if (isNaN(myDonation)) {
    $('donationerror').innerHTML = 'Amount must be numeric'
    isValid = false
  }

  return isValid
}

var addpatron = function () {
  var isValid = validateItems() // do call this

  if (isValid == true) {
    $('myform').submit()
  } else {
    $('endmessage').innerHTML = 'Patron Not Added!'
  }
}