Как смоделировать нажатие кнопки изображения - PullRequest
Новая
       10

Как смоделировать нажатие кнопки изображения

0 голосов
/ 03 января 2012

Я давно занимаюсь веб-разработкой, но только недавно обнаружил существование тега <input type="image">.

У меня есть скрипт greasemonkey, который автоматически отправляет следующую форму на веб-странице. 

<form id="form1">
      <input id="radio1" type="radio" /> 
      <input id="radio2" type="radio" /> 
      <input id="buttn1" type="submit" />
</form>

И я использую следующий скрипт для отправки этой формы. 

var form = document.getElementById('form1');

for(var i = 0; i < form.elements.length; i++) {
    var element = form.elements[i];
    if(element.id == 'radio2') {
       element.setAttribute("checked", "checked");        
    }
    if(element.id == 'buttn1') {
        var button = element;
    }
}
button.click();

Я сразу соглашусь, что, возможно, есть 1000 лучших способов сделать это, но это работает в этой ситуации. Это прекрасно работает, но я немного застрял при отправке следующей формы 

<form id="form2">
    <input type="image" id="img1" src="img1.png" />
    <input type="image" id="img2" src="img2.png" />
</form>

Я пытался сделать то же самое, вызвав click () для объекта input-image, но это не работает. Какие-либо предложения. Использование jQuery хорошо, но меня особенно интересует чистая версия JS.

Ответы [ 3 ]

2 голосов
/ 03 января 2012

Вот более легкое решение, чем использование jquery:

Добавить новый прототип с именем «click» 

HTMLElement.prototype.click = function() {
    var evt = this.ownerDocument.createEvent('MouseEvents');
    evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
    this.dispatchEvent(evt);
}

Тогда, чтобы использовать это .. 

<form>
    <input id="some_id" type="checkbox" name="foo"></input>
</form>
<script>
   document.getElementById('some_id').click();
</script>
1 голос
/ 03 января 2012

Дайте имена для каждого изображения и попробуйте позвонить $("#<image_id>").click();, если вы используете jQuery.

<form id="form2" method="get">
    <input type="image" id="img1" src="https://encrypted.google.com/images/logos/ssl_logo.png" name="image1"/>
    <input type="image" id="img2" src="http://www.w3schools.com/images/w3schoolslogo.gif" name="image2"/>
</form>

Сервер получит такие параметры, как image1.x=0&image1.y=0 or image2.x=0&image2.y=0

0 голосов
/ 03 января 2012

Вы можете использовать JQuery Submit 

$('#Form2').submit();

В ответ на ниже, это просто отправит форму и все данные. Если вы хотите отправить форму Form1, отправьте ее.

Нет также очевидной причины, по которой это могло бы не работать в 1.7 - есть ли другой код JavaScript?

...