Question

我有一堆jQuery选择器，它们在包含许多函数的文件中使用。为此，我将jQuery选择器缓存在js文件的顶部（全局），并将文件本身加载到HTML代码的<head>标记中

 var validationAlertPayment = $('#validationAlertPayment'),
     owner = $('#owner'),
     cardNumber = $('#cardNumber'),
     cardNumberField = $('#card-number-field'),
     CVV = $("#cvv"),
     mastercard = $("#mastercard"),
     confirmButton = $('#submitCCDetails'),
     editCCButton = $('#editCCDetails'),
     visa = $("#visa"),
     amex = $("#amex"),
     cc_verified_icon = $('#cc_verified_icon'),
     cc_month = $("#cc_month"),
     cc_year = $("#cc_year"),
     edit_payment_block = $('#edit-payment-block'),
     pay_now = $('#pay-now'),
     serviceRequestNo = $('#serviceRequestNo'),
     serviceReqLabel = $('#serviceReqLabel'),
     serviceRequestKey = $('#serviceRequestKey'),
     requestNumber = $('#requestNumber'),
     chat_Lines = $('#chatLines'),
     tranStepIcon = $('#transition-step-icon'),
     transitionArea = $("#transitionArea"),
     red_runway = $('#red_runway'),
     transition_label = $("#transition-label"),
     paymentIcon = $('#paymentIcon'),
     confirmIcon = $('#confirmIcon'),
     red_anim = $('#red-anim'),
     runway5 = $('#runway5'),
     confirmLine = $('#confirmLine'),
     paymentLine = $('#paymentLine'),
     title_greeting = $('#title_greeting'),
     runway1 = $('#runway1'),
     typeOfClaimLine = $('#typeOfClaimLine'),
     offerLine = $('#offerLine'),
     runway2 = $('#runway2'),
     runway3 = $('#runway3'),
     runway4 = $('#runway4'),
     typeOfClaimIcon = $('#typeOfClaimIcon'),
     offerIcon = $('#offerIcon'),
     shippingIcon = $('#shippingIcon'),
     shippingLine = $('#shippingLine'),
     estimated_wait_time = $('#estimated-wait-time'),
     offlineMsg = $('#offlineMsg'),
     chatWindow = $('#chatWindow'),
     appHistory = $('#appHistory'),
     attachment_div = $('.attachment-div'),
     appTransitions = $("#appTransitions"),
     delivery_address = $("#delivery_address"),
     delivery_date = $("#delivery_date"),
     toggleButton = $('#toggleButton'),
     transition_bar = $("#transition-bar"),
     offerredImageId = $("#offerredImageId"),
     offerPopupId = $("#offerPopupId"),
     popupTitleId = $("#popupTitleId"),
     chatWindowMessageMainDiv = $("#chatWindowMessageMainDiv"),
     chatMessageHeader = $("#chatMessageHeader"),
     confirmationDetails = $("#confirmationDetails"),
     deliveryDateTitle = $("#deliveryDateTitle"),
     shippingCodeTitle = $("#shippingCodeTitle"),
     confirmAddressId = $("#confirmAddressId"),
     offerTitle = $("#offerTitle"),
     confirmMakeModelId = $("#confirmMakeModelId"),
     customerVerificationIcon = $('#customerVerificationIcon'),
     mobileAppBody = $("#mobileAppBody");

是的，这是很多缓存..

但是现在当我尝试在同一个文件中的某些函数中使用这些变量中的一些时，我没有获得在函数中执行任何jQuery方法的选择器。例如transitionArea = $("#transitionArea")。当我记录变量

时，我得到undefined

已更新：在特定事件上动态填充DOM上无效的选择器变量。页面加载后

有人可以帮助我理解这种行为吗？我该如何做到这一点？

注意我使用的是jQuery 3.2.1，并且首次加载后页面不会被刷新/重新加载。

全局jquery选择器缓存无法正常工作

0 个答案: