There html form with input field. This field is the address of the picture. It is necessary that after changing the text in the field, a new picture at the specified address is loaded. On the onBlur event I call a function that should change the address of the image

<img src='image1.gif' name='pic1'> <input type='text' name='img1' id='img1' value='image1.gif' onblur='iload(1)'>

JS function:

 function iload(num) { pic='pic'+num; img='img'+num; document.pic.src = document.getElementById(img).value; }

in the html-code everywhere the index is "1", since it is not known how many such elements will be: 1, 2 or 100, therefore a universal solution is needed. The script does not work and the error console returns the following:

[02.14.1971 17:06:45] JavaScript - http://site.ru/page.php Event thread: blur Uncaught exception: TypeError: Cannot convert error thrown at line 6, column 1 in iload (num) in http://site.ru/script.js: document.pic.src = document.getElementById (img) .value; called from line 1, column 0 in <anonymous function> (event) in http://site.ru/page.php: iload (1)

As far as I understand, he converts the object "document.pic", but it is necessary "document.pic1" (pic = 'pic1').

Tell me what-where to change that the script has earned. Thank.

    2 answers 2

    The <img> no name attribute (standard) ( htmlbook.ru )

    So try changing it to id

     <img src='image1.gif' id='pic1'> function iload(num) { pic='pic'+num; img='img'+num; document.getElementById(pic).src = document.getElementById(img).value; }
    • earned - Antiless

    Take the item by ID.

      document.getElementById('img1').attributes['src'].nodeValue = 'newValue'; //или, если так, как в вашем примере, только правильно: document[pic].src = document.getElementById(img).value;

    But somehow your logic is absolutely terrible.

    • I found it in Yandex (: - Antiless