jquery - Jquery Uncaught ReferenceError: $var is not defined
问题描述
我有一个问题,我不断收到错误
未捕获的引用错误:未定义 $shipping_address
我的目标是使用 id 获取输入中的值,然后将它们发布到端点。有人可以看看我的代码,让我知道我哪里出错了。
$(function() {
// storing these in the DOM
var $address_1 = $('#address_1').val();
var $shipping_address = $('#shipping-address').val();
var $shipping_address2 = $('#shipping-address2').val();
var $shipping_city = $('#shipping-city').val();
var $shipping_state = $('#shipping-state').val();
var $shipping_zip = $('#shipping-zip').val();
});
//this is the event im looking for so i can post the users data to be validated by USPS
$(function() {
$("#ao_solo").click(function() {
alert('the click worked'.$shipping_address);
//console.log("the same as billing addy is checked");
// creating an array here
var user_shipping_address = {
shipping_address: $shipping_address.val(),
shipping_address2: $shipping_address2.val(),
shipping_city: $shipping_city.val(),
shipping_state: $shipping_state.val(),
shipping_zip: $shipping_zip.val()
};
// now im calling Nates USPS API
$.ajax({
type: 'POST',
url: '/async/addressverification',
data: user_shipping_address,
success: function(sanitized_address) {
var address_template = "" +
"<div class='form-check'>" +
"<input class='form-check-input' type='radio' name='flexRadioDefault' id='flexRadioDefault1'>" +
"<label class='form-check-label sugaddyspace' for='flexRadioDefault1'>Suggested Address:" +
"<span id='address_1'>" +
"{{shipping_address2}}" +
"{{shipping_address}}" +
"{{shipping_city}}" +
"{{hipping_state}}" +
"{{shipping_zip}}" +
"</label>" +
"</div>" +
"<hr/>";
// some templating studd using Mustache.js
// function add_sanitized_address(sanitized_address){
// $sanitized_address.append(Mustache.render(address_template, sanitized_address));
// }
},
error: function() {
//error in case something goes wrong.
alert('error saving order or something lol');
}
});
});
});
更新:
根据下面的评论,这里是新代码,但我仍然看到同样的错误
我按照你所说的做了,但我仍然遇到同样的错误
$(function() {
var address_1 = $('#address_1').val();
var shipping_address = $('#shipping-address').val();
var shipping_address2 = $('#shipping-address2').val();
var shipping_city = $('#shipping-city').val();
var shipping_state = $('#shipping-state').val();
var shipping_zip = $('#shipping-zip').val();
$("#ao_solo").click(function() {
alert('the click worked');
//console.log("the same as billing addy is checked");
// creating an array here
var user_shipping_address ={
shipping_address: $shipping_address.val(),
shipping_address2: $shipping_address2.val(),
shipping_city: $shipping_city.val(),
shipping_state: $shipping_state.val(),
shipping_zip: $shipping_zip.val()
};
// now im calling Nates USPS API
$.ajax({
type:'POST',
url:'/async/addressverification',
data: user_shipping_address,
success: function(sanitized_address){
alert('the click worked');
},
error: function(){
//error in case something goes wrong.
alert('error saving order or something lol');
}
});
});
});
解决方案
问题是因为$shipping_address
和其他变量仅在您拥有的第一个 document.ready 处理程序的范围内定义。要解决此问题,请将它们合并为一个。
另外请注意,$
命名约定用于指示包含 jQuery 对象的变量。由于您正在处理的值是字符串,您应该删除$
前缀。
$(function() {
var address_1 = $('#address_1').val();
var shipping_address = $('#shipping-address').val();
var shipping_address2 = $('#shipping-address2').val();
var shipping_city = $('#shipping-city').val();
var shipping_state = $('#shipping-state').val();
var shipping_zip = $('#shipping-zip').val();
$("#ao_solo").click(function() {
var user_shipping_address = {
shipping_address: shipping_address,
shipping_address2: shipping_address2,
shipping_city: shipping_city,
shipping_state: shipping_state,
shipping_zip: shipping_zip
};
$.ajax({
type: 'POST',
url: '/async/addressverification',
data: user_shipping_address,
success: function(sanitized_address) {
alert('the click worked');
},
error: function() {
alert('error saving order or something lol');
}
});
});
});
推荐阅读
- javascript - 我希望能够在我的 firebase 数据库中获取自动生成的 id 子值并在函数中使用它们
- directx - 从 GPU 获取 FPS 和帧时间信息
- python - 如何在 Python 中提取极坐标图信息?
- javascript - 为什么 Cordova 项目具有相同的 index.js 副本?
- python - 如何将文本模式保存到不同的列表python中
- javascript - 如何将按钮的内容分离到另一个 HTML 文件中?
- java - 在运行简单的 selenium+java 代码时遇到异常?
- android - ionic 4 - android后退按钮不适用于标签栏路线
- c++ - 使用两个 while 循环的简单 C++ 代码说明
- r - 如何调整和删除交叉表图中的图例标签?