Clash Royale CLAN TAG

ajax doesn't work in chrome [duplicate]

This question already has an answer here:

I want to show html files on the same page after the button is clicked.
I created 3 buttons and when I click on it the browser loads according page with images. But Chrome shows me an error:

jquery.min.js:2 Failed to load file:///C:/Users/Ksena/proj/ajax/tabs/autumn.html: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
send @ jquery.min.js:2
ajax @ jquery.min.js:2
w.fn.load @ jquery.min.js:2
(anonymous) @ index.html:23
dispatch @ jquery.min.js:2
y.handle @ jquery.min.js:2


<div class="container">
<button class="summer">Summer</button>
<button class="autumn">Autumn</button>
<button class="winter">Winter</button>
<div class="output"></div>
</div>
<script>
$(document).ready(function() {
$('.summer').click(function(){
$('.output').load('./summer.html');
});
$('.autumn').click(function(){
$('.output').load('./autumn.html');
});
$('.winter').click(function(){
$('.output').load('./winter.html');
});
});
</script>


This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

1 Answer
1

You cannot use .load() on your local filesystem, as it can lead to grave security issues (Like accessing files outside the directory where the file is stored.)

.load()

Have a look at these answers which will give you some direction:

jQuery .load() not working in Chrome

jQuery load() code not working in Google Chrome