Sign in to follow this  
Followers 0
Biotoxsin

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

4 posts in this topic

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

Подскажите как на 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. Задачка у меня сложнее но эта база поможет мне её решить.

Share this post


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 );
    }
};

 

Biotoxsin likes this

Share this post


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 );
    }
};

 

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

 

Share this post


Link to post
Share on other sites

Они и так ограничены блоком "tabs".

container = document.getElementById( 'tabs' );
tabs = container.getElementsByTagName( 'input' );

 

Biotoxsin likes this

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0

  • Recently Browsing   0 members

    No registered users viewing this page.