Reputation: 1949
jQuery .data()
seems to be broken on IE10.
The below code works fine with Chrome and FF but trigger an error
SCRIPT438: Object doesn't support property or method data
in IE10.
Any idea why / how to have it working under IE10 ?
$(document).ready(function() {
$('body').on("click", ".clickme", function(){
parent = $(this).parents(".container");
html = $(parent.data('my-target')).html();
$('#result').html(html);
});
});
#result {
margin: 15px;
}
#second, #fourth {
display: none;
}
.clickme {
margin: 5px;
padding: 10px;
}
<script src="https://code.jquery.com/jquery-2.1.4.js"></script><div class="container" data-my-target="#second">
<div class="clickme" id="first">Click me</div>
<div id="second">Hello World</div>
</div>
<div class="container" data-my-target="#fourth">
<div class="clickme" id="third">Cliquez-moi</div>
<div id="fourth">Bonjour !</div>
</div>
<div id="result">
</div>
See it on jsbin : http://jsbin.com/hovuwequvu/edit?html,css,js,output
Upvotes: 1
Views: 1592
Reputation: 78525
parent
is a poor (implicitly global) variable name. It's conflicting with window.parent
property:
$(document).ready(function() {
$('body').on("click", ".clickme", function(){
parent = $(this).parents(".container");
// ^^ You are attempting to write to the window.parent property here
html = $(parent.data('my-target')).html();
$('#result').html(html);
});
});
Change it to a more appropriate name and also declare it as a variable:
$(document).ready(function() {
$('body').on("click", ".clickme", function(){
var parentContainer = $(this).parents(".container");
var html = $(parentContainer.data('my-target')).html();
$('#result').html(html);
});
});
Upvotes: 3