Функция Javascript не распознается как функция

Question

Когда я загружаю страницу и изменяю параметр в меню выбора, в отладочных консолях я получаю сообщение об ошибке, говорящее, что descrip () не является функцией

<script type="text/javascript">
function descrip(){ 
    var aid = new XMLHttpRequest("GET",document.ads.subject.value,false);  
    var file = "includes/ads/"+aid+".txt";
    document.ads.descrip.write(file);
    return aid;
}
</script>

<form name="ads" method="post" action="scripts/del_advert_script.php">
<label>Advertisements by subject:</label><select name="subject" id="sub" onChange="descrip()">
        //PHP Block that works
    </select>
    <textarea id="descrip" name="description" cols="100" rows="3" readonly="readonly">

    </textarea>
    <br />
    <input type="submit" value="Submit" />
</form>

Answer 1

Здесь я вижу четыре проблемы: ваш XMLHttpRequest, ваш метод записи текста в <textarea>, ваш метод получения текущего выбранного значения <select>, и ваша функция имеет то же имя, что и ID (проблема только в IE).

AJAX работает не совсем так, как у вас выше, как это ни печально. Вместо этого вы должны перепрыгнуть через несколько обручей, чтобы запустить запрос и вернуть его responseText обратно. Вот пример кода:

var xhr = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
xhr.onreadystatechange = function () {
    // When the server has returned a response, and it is good, we're ready
    if (xhr.readyState === 4 && xhr.status === 200) {
        // do something with xhr.responseText
    }
};
// Three arguments: type of request, url, and should the request be async
xhr.open("GET", "url here", true);
xhr.send(null);

Это очень легкий пример, но он демонстрирует общую концепцию. Для получения дополнительной информации об AJAX в целом см. Превосходное руководство MDC по началу работы с AJAX.

Далее, в DOM нет функции write для <textarea>. Чтобы изменить то, что находится в текстовой области, вам нужно использовать свойство value:

your_textarea.value = "something here";

Или, если вы хотите добавить новый текст к текстовой области:

your_textarea.value += "something here";

Это позволит правильно вставить текст.

В-третьих, ваш метод определения текущего выбранного значения <option> в <select> также не работает (к сожалению). Чтобы получить значение текущего выбранного параметра, вы должны использовать свойство selectedIndex для <select>, а также его свойство options:

your_select.options[your_select.selectedIndex].value;

Это вернет значение выбранного в данный момент параметра.

Наконец, и это только проблема в IE, ваша функция имеет то же имя, что и ID. В IE любые идентификаторы определяются глобально как элементы DOM, так что это проблема. Таким образом, простое изменение имени вашей функции на другое должно облегчить эту проблему.

В общем, вот код, который, я считаю, работает (хотя и не проверен):

<script type='text/javascript'>
function select_change() {
    var xhr = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
    xhr.onreadystatechange = function () {
        // When the server has returned a response, and it is good, we're ready
        if (xhr.readyState === 4 && xhr.status === 200) {
            var file = "includes/ads/" + xhr.responseText + ".txt.";
            document.ads.descrip.value += file;
        }
    };
    // Three arguments: type of request, url, and should the request be async
    xhr.open("GET", 
            document.ads.subject.options[document.ads.subject.selectedIndex].value, 
            true);
    xhr.send(null);
}
</script>

<form name="ads" method="post" action="scripts/del_advert_script.php">
<label>Advertisements by subject:</label><select name="subject" id="sub" onchange="select_change()">
        //PHP Block that works
    </select>
    <textarea id="descrip" name="description" cols="100" rows="3" readonly="readonly">

    </textarea>
    <br />
    <input type="submit" value="Submit" />
</form>

Answer 2

Это дикое предположение, поскольку я ни в коем случае не человек из Javascript, но мне интересно, может ли предоставление вашей текстовой области id = descrip (то же имя, что и ваша функция) может сбить с толку интерпретатора?

Answer 3

В Internet Explorer идентификаторы элементов определяются как константы window.Тот факт, что ваша функция названа так же, как и идентификатор вашего элемента, создает конфликт, и элемент выигрывает, поэтому IE видит, что вы пытаетесь вызвать текстовую область вместо функции.