获取上（点击），额外的Ajax请求？ [英] Getting extra ajax requests on(click)?
问题描述
如果您点击顶部导航按钮在这个网站我工作的 http://techxpertschico.com/你开始也许5按钮，点击它，你可以在督察的网络部分中看到后获得额外的Ajax请求。我无法弄清楚发生了什么，所以我不知道在我的code改变什么导致这些额外的请求。此问题会导致极端的laggyness并最终关闭的经验，直到你刷新，以便......它坏我的UX的，至少可以说。
If you click on the top nav buttons on this website I'm working on http://techxpertschico.com/ you start getting extra ajax requests after maybe 5 button clicks which you can see in the network section of the inspector. I can't figure out whats happening to cause these additional requests so I'm not sure what to change in my code. This issue causes extreme laggyness and eventually shuts down the experience until you refresh so... its bad for my UX to say the least.
下面是一个典型的锚标记
Here is a typical anchor tag
<a class="ajaxAnchor" href="home.html">
<div id="navOne" class="top">
<span class="top">Home</span>
</div>
</a>
这是jQuery的为锚
This is the jQuery for the anchors
$('.ajaxAnchor').on('click', function (event){
event.preventDefault();
var url = $(this).attr('href');
$.get(url, function(data) {
$('section.center').html(data);
});
});
这是获得该主页按钮装在这种情况下，例如HTML
This is example html that gets loaded by the Home Button in this case
<script src="scripts/scripts.js"></script>
<h1>Welcome to TechXperts Chico!</h1>
<p>
Welcome to the home of TechXperts! We are a computer, phone, and tablet repair shop located in Chico! We try to create a friendly and comfortable place for you to learn more about technology! Whether buying a new computer or trying to get the one you have to do what you want, everyone needs tech help at times. We offer a full range of repairs and tutorials to help you get the most out of your technology. If you have any questions feel free to call our office, or book an appointment below! Our goal is to help you to understand your device! We feel that is our responsibility to the community as the local computer experts.
</p>
<a href="https://techxpertschico.youcanbook.me/" class="appointmentButton">Book Appointment Now</a>
<a href="mailto:techxpertschico@gmail.com" class="appointmentButton">Email TechXperts</a>
<h1>Friendly staff always available to answer questions!</h1>
如果您有什么需要请让我知道！
If you need anything else please let me know!
推荐答案
在每一个加载的资源，你必须引用＆LT;脚本SRC =脚本/ scripts.js＆GT;＆LT; / SCRIPT＆GT ; 这是增加一个新的点击处理程序，每当一个新的页面加载 ajaxAnchor 元素
On every loaded resource, you have reference to <script src="scripts/scripts.js"></script> which is adding a new click handlers to the ajaxAnchor elements whenever a new page is loaded.
而不是使用事件代表团，包括这个脚本只在主网页
Instead use event delegation and include this script only in the main page
这篇关于获取上（点击），额外的Ajax请求？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
