Thirupathi Banothu Ответов: 0

Переключатели ВКЛ проверено с загрузкой страницы информация об одном переключателе должна отображаться динамически при загрузке страницы

при загрузке страницы по умолчанию должна отображаться первая информация о переключателе но это не так 1-я кнопка переключателя проверена, и вся информация о переключателе reimaging также показывает, что я хочу показать один раз, и 1-й должен быть показан, когда страница загружается, пожалуйста, помогите мне

Что я уже пробовал:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<center>
    <div class="wrapper">
            <div class="service-icon1 box one">
               <img src="images/images-1-2-100x100.jpg" alt="" class="client-img" >
            </div> 
            <div class="service-icon1 box two">
               <img src="images/krueger-carmen.jpg" alt="" class="client-img" >
            </div> 
            <div class="service-icon1 box three">
               <img src="images/hurdbig-100x100.jpg" alt="" class="client-img" >
            </div> 
        <label ><input type="radio" name="colorRadio" value="one" checked></label>
        <label><input type="radio" name="colorRadio" value="two" ></label>
        <label><input type="radio" name="colorRadio" value="three" ></label>
    </div>
    <div class="content">
        <div class="box one">
            <p class="text-center">Lorem ipsum dolor sit amet consectetur adipisicing elit. Commodi omnis quisquam aliquid voluptatum sapiente provident.</p>
                <h3><a href="#" style="text-decoration:none;">Mark</a> </h3>
                <span>CEO</span>
        </div>
        <div class="box two">

            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam aliquid sapiente nisi? Recusandae, repudiandae culpa? Explicabo culpa necessitatibus recusandae modi.</p>
                <h3><a href="#" style="text-decoration:none;"> Lee</a></h3>
        </div>
        <div class="box three">
            <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Beatae, perferendis.</p>
                <h3><a href="#"style="text-decoration:none;">Stefan</a> </h3>
        </div>
    </div>

<script type="text/javascript" src="Demo.js"></script>



</center>



<script type="text/javascript">
$(document).ready(function(){
  
    $('input[type="radio"]').click(function(){
      var inputValue = $(this).attr("value");
      var targetBox = $("."+ inputValue );
      $(".box").not(targetBox).hide();
      $(targetBox).show();
    });
  });
</script>

0 Ответов