Jump to content

Переключение input средствами JS


Recommended Posts

Здравствуйте!

Подскажите как на JS можно переключать input radio? К примеру нужно сделать имитацию переключения input как если бы у них было одно name.

<div class="input-box">
  <input type="radio" name="i-1"/>
  <input type="radio" name="i-2"/>
  <input type="radio" name="i-3"/>
</div>

Из моего понимания нужно для каждого активированного инпута прописать выключение остальных. Но в JS я не силён. Помогите кто чем может.

 

p.s. Задачка у меня сложнее но эта база поможет мне её решить.

Link to post
Share on other sites

html:

<div id="tabs">
    <input name="i-1" type="radio">
    <input name="i-2" type="radio">
    <input name="i-3" type="radio">
</div>

js:

window.onload = function () {
    var container, tabs, i, j;

    container = document.getElementById( 'tabs' );

    tabs = container.getElementsByTagName( 'input' );

    for ( i = 0; i < tabs.length; i++ ) {
        tabs[i].addEventListener( 'click', function () {
            for ( j = 0; j < tabs.length; j++ ) {
                if ( tabs[j] !== this ) {
                    tabs[j].checked = false;
                }
            }
        }, true );
    }
};

 

Link to post
Share on other sites
В 06.05.2019 в 5:21 AM, c00x сказал:

html:


<div id="tabs">
    <input name="i-1" type="radio">
    <input name="i-2" type="radio">
    <input name="i-3" type="radio">
</div>

js:


window.onload = function () {
    var container, tabs, i, j;

    container = document.getElementById( 'tabs' );

    tabs = container.getElementsByTagName( 'input' );

    for ( i = 0; i < tabs.length; i++ ) {
        tabs[i].addEventListener( 'click', function () {
            for ( j = 0; j < tabs.length; j++ ) {
                if ( tabs[j] !== this ) {
                    tabs[j].checked = false;
                }
            }
        }, true );
    }
};

 

А как ограничить работу этих правил только в в одном блоке?

 

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...