Uncaught TypeError: Object #article has no method 'load'
I am populating a select box based on the selection of another select box, but I am getting the following error when I look at the google chrome console:
Uncaught TypeError: Object #article has no method 'load'
Here is the html/script:
<html>
<head>
</head>
<body>
<h1>Populating Select Boxes</h1>
<form action="select-boxes.html">
<label for="category">Category:</labe开发者_如何学Cl>
<select name="category" id="category">
<option value="easy">Easy</option>
<option value="medium">Medium</option>
<option value="hard">Hard</option>
</select>
<input type="submit" value="next »"/>
<select name="article" id="article"></select>
</form>
<script src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script>
$(document).ready(function() {
$('form').submit(function(event) {
event.preventDefault();
var categoryName = $('#category').val();
('#article').load('select-boxes-' + categoryName + '.html');
});
});
</script>
</body>
Here is an example of select-boxes-easy.html that gets loaded if easy is selected:
<option value="easy1">Easy 1</option>
<option value="easy2">Easy 2</option>
<option value="easy3">Easy 3</option>
<option value="easy4">Easy 4</option>
<option value="easy5">Easy 5</option>
<option value="easy6">Easy 6</option>
After adding the $, I now get the following error when selecting a category and then clicking next:
XMLHttpRequest cannot load file:///C:/Users/xaisoft/Desktop/javascripting/PopulateSelectBoxes/select-boxes-easy.html. Origin null is not allowed by Access-Control-Allow-Origin.
You forgot the dollar:
$('#article').load(...);
精彩评论