загрузка функции по клику

Question

У меня есть следующий фрагмент кода

<a onclick="$('#result').load('codes/test.html');$('#result').show();" >XHTML code</a>

, он отлично загружает содержимое test.html в результате div и также делает его видимым.До этого момента все хорошо.Когда я пытаюсь добавить функцию prettyPrint(), которая применяет некоторые модификации к тексту и изменяет код на следующее:

<a onclick="$('#result').load('codes/test.html');$('#result').show();prettyPrint();" >XHTML code</a>

, я не могу заставить работать prettyPrint (), вместо этого, если я добавляюonmouseout="prettyPrint(); это работает, когда я снимаю курсор.У меня нет опыта работы с javascript и jquery, поэтому я не знаю, в чем реальная проблема, поэтому я был бы признателен за любую помощь о том, как заставить prettyPrint работать onclick.

Answer 1

Если вы используете jQuery, почему вы беспокоитесь о встроенном Javascript? Почему бы и нет:

<script type="text/javascript">
$(function(){
    $('#myLink').click(function(){
        $('#result').load('codes/test.html', function() {
            $('#result').show();
            prettyPrint();
        });

        return false;
    });
}):
</script>

<a id="myLink" href="#">XHTML code</a>

Edit:

Исправлен код, поэтому он вызывает prettyPrint(), когда вызывается обратный вызов загрузки.

Answer 2

Нагрузка асинхронная. Когда вызывается prettyPrint, текст может еще не быть там.

<a onclick="$('#result').load('codes/test.html', function(){prettyPrint();$('#result').show();});" >XHTML code</a>

load () принимает второй аргумент, который является функцией для вызова, когда загрузка завершена. Я переместил туда симпатичную принт и шоу.

Answer 3

Ваша проблема в том, что вы неправильно понимаете, как работает .load(). Он не блокируется, пока данные не загружены. Вместо этого он только начинает загрузку и сразу же возвращается. Поэтому ваша функция prettyPrint вызывается, когда данные еще не загружены.

Чтобы исправить это, передайте функцию обратного вызова на .load. Этот обратный вызов будет вызван, когда загрузка завершится:

$("#result").load( '...',
    function() { 
        $("#result").show();
        prettyPrint();
    }
}

Answer 4

Вы должны использовать функцию обратного вызова:

<a onclick="$('#result').load('codes/test.html', function() {prettyPrint();}).show();" >XHTML code</a>

Answer 5

Вы можете сделать следующее:

$('#result').show("fast",function(){ prettyPrint();});