如何使用JavaScript填写网络表单

Question

I want to fill the form data using javascript in chrome. I have filled all other fields correctly but the field(html) bellow is not working for me. (there must be other scripts working this form, i don't about that)

<select name="month" class="valid">
<option value="">
    <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">Month</font>
    </font>
</option>
<option value="01">
    <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">January</font>
    </font>
</option>
<option value="02">
    <font style="vertical-align: inherit;">
        <font style="vertical-align: inherit;">February</font>
    </font>
</option>
<option value="03">
    <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">March</font>
    </font>
</option>

Month January February March

i have tried some code but it doesn't work.

var month = document.querySelector('input[name="month"]');
month.selectedIndex = 3;

i am using this script in chrome console, is there any way i can fill this field with javascript?

here is the form link

Answer 1

First, your selector input[name="month"] does not match any elements.

Secondly, once you are able to select the correct element you can set it's value using element.value = 3 .

See more about the value property here.

Answer 2

This code does exactly what you looking for. It selects March in your select. Note: correct selection in not var month = document.querySelector('input[name="month"]'); Use instead

var month = document.querySelector('select[name="month"]');

 $(function() { var month = document.querySelector('select[name="month"]'); month.selectedIndex = 3; }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select name="month" class="valid"> <option value=""> <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">Month</font> </font> </option> <option value="01"> <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">January</font> </font> </option> <option value="02"> <font style="vertical-align: inherit;"> <font style="vertical-align: inherit;">February</font> </font> </option> <option value="03"> <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">March</font> </font> </option> </select>