.load не работает для изменения содержимого div

Я пытаюсь изменить содержимое определенного div в событии onclick, используя .load, по какой-то причине он не работает, и я не знаю почему. Я пытаюсь повторить ту же самую вещь, который был задан в этой проводки https://stackoverflow.com/questions/3432553/how-to-load-replace-an-entire-div-from-an-external-html-file .load не работает для изменения содержимого div

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> 
<script type="text/javascript" src="https://www.google.com/jsapi"></script> 

<script type="text/javascript"> 


$(document).ready(function() { 

$('#electric').bind('click',function(){ 
    $("#chart_div").load("new_content.html"); 
}); 
}); 

</script>

HTML

<div id="container"> 
     <div id="chart_div">hello</div> 
</div> 
    <ul class="nav nav-pills"> 
    <li class="active"> 
    <a id="electric" href="#">Electric link</a> 
    <li class="active"> 
    <a href="#">Gas</a> 
</ul>

new_content.html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title>Graph</title> 
</head> 
<body> 
    <p>New Content!</p> 
</body>

источник

2013-03-06 ocat

$ («# chart_div»). Нагрузки ("new_content.html"); Это оно !!!! – madhairsilence

Вы используете это с локального диска в качестве вызова файловой системы? или через приложение/веб-сервер? – Marc

Я запускаю это с моего локального диска. – ocat

для 1,6

$('#electric').live('click',function(){ 
//your code 
});

использование на() от 1,9 версии ..

$(document).on('click','#electric',function(){ 
//your code.. 
});

источник

2013-03-06 05:14:14 sasi

Umm, '.on()' поддерживается в версии 1.6.1? Потому что согласно ссылке jQuery, это версия, которую использует OP. –

забудьте..измените его. – sasi

@Sasi прочитал документы ** PLZ **, чтобы опубликовать лучшие ответы. – Jai

Попробуйте с этим:

<script type="text/javascript"> 
    $(function(){ 
    $("#electric").click(function(e){ 
     e.preventDefault(); 
     $("#chart_div").load("new_content.html"); 
    }); 
    }); 
</script>

Вы не должны предназначаться #chart_div, потому что это не в new_content.html.

источник

2013-03-06 05:18:01 Jai

@downvoter, почему это вниз. – Jai

Обычный мужчина дает повод для этого. – Jai

Ну, я не спустил вниз, но пролить свет здесь, передавая 'e.preventDefault()' ничего не делает. Тем не менее, +1 для исправленного таргетинга '# chart_div'. –

Нет необходимости делать больше, просто

$(document).ready(function(){ 
    $("#electric").click(function(e){ 
     e.preventDefault(); 
     $("#chart_div").load("new_content.html"); 
    }); 
});

источник

2013-03-06 05:18:03

Некоторые из изменений,

У вас не хватает Http: в вас сценарий тег,

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>

триггер сценарий на "ON" мероприятие

$(function(){ 
    $("#electric").on('click',function(){ 
     $("#chart_div").load("new_content.html #chart_div"); 
    }); 
});

источник

2013-03-06 05:19:07 EnterJQ

про него пропустил $ (function() {в коде. –

Спасибо. Я исправил недостающие http: – ocat

$(function(){ отсутствует в коде. Заверните свой код внутри document.ready, которого вы не сделали.

$(function() 
{ 
    $("#electric").on('click',function() 
    { 
     $("#chart_div").load("new_content.html #chart_div"); 
    }); 
});

источник

2013-03-06 05:23:26

вы должны .ready функции для запуска нажмите событие .... потому что, когда документ будет готов только тогда вы можете обрабатывать событие нажмите

$(document).ready(function(){ 
$("#electric").click(function(e){ 
$("#chart_div").load("new_content.html"); 
}); 
});

источник

2013-03-06 11:02:25

.load не работает для изменения содержимого div

ответ

Смежные вопросы