尝试在JS中单击时更改人字形方向时，只会更改1个人字形。 - javascript

我正在尝试更改列表组上人字形的方向，使其在单击/激活时指向内部。但是，使用下面的代码，我只会得到第一个人字形更改方向。我正在循环菜单（包括V形框）中菜单项的代码，因此我需要找到一种使该功能镜像菜单中每个项的方法。

我意识到这很可能是因为js的目标是ID。但是，如果我更改代码以使directionToggle反映一个类，则会同时更改所有箭头。

鉴于我正在使用php循环每个菜单项的行为，我该如何单独执行此操作？

<?php foreach ($tasks as $number => $name) { ?>
  <?php $is_heading = ends_with($name, ':'); ?>
    <?php if (!$is_heading): ?>
       <li class="list-group-item" tabindex="-1">
         <a class="listgroupwrap" href="#<?= $task_slugs[$number] ?>"></a>
         <span class="step-number-container"> <?= $number + 1 ?></span>
         <span class="btn-check">
            <i class="glyphicon glyphicon-ok"></i>
         </span>
         <span class="step-checkbox"></span>
         <span class="step-name content-blurred"><?= $name ?></span>
         <span class="step-show-hide">
           <span class="btn btn-showhide">
              <i class="glyphicon glyphicon-chevron-right" id="direction-toggle">
              </i>
           </span>
         </span>
       </li>
     <?php else: ?>
      <li class="list-group-item step-heading" tabindex="-1">
        <a class="listgroupwrap" href="#<?= $task_slugs[$number] ?>">
        </a>
        <span class="step-number-container"> <?= $number + 1 ?></span>
		<span class="step-name content-blurred"><?= $name ?>
        </span>
      </li>

      <?php endif ?>
<?php } ?>

var rightChevron = $('.glyphicon-chevron-right');
    var directionToggle = $('#direction-toggle');

    var fullscreenButton = $('.btn-showhide');
    fullscreenButton.click(function () {
        $('body').toggleClass('fullscreen');
        directionToggle.addClass('glyphicon-chevron-left');
        directionToggle.toggleClass('glyphicon-chevron-right');
    });

参考方案

如果您要设置多个方向切换的样式，则需要使其成为一类。作为ID，JQuery仅获得第一个。一旦成为类，请使用Jquery的.each（）函数：

$('.direction-toggle').each(function(){
    $(this).addClass(//class);
});

在您的点击事件中。

编辑：
根据评论，似乎您想一次更改1个箭头的方向，无论单击哪个。这是您要执行的操作：

$('.btn-showhide').click(function(){
    $(this).children().addClass(//class).
});

在提交时在表单操作中获取变量丢失 - javascript

            当表单由onchange事件提交时，它不会保留get变量view。任何想法为什么会发生这种情况？提交后，这是它进入的网址，index?month=February&year=2014<form action="index?view=list" class="pure-form pure-fo…

选择后显示输入元素 - javascript

我有一个表格，其中取决于用户的选择，输入元素是否可见。实际上，用户正在以另一种形式设置已定义的合作伙伴类型，并且如果选中该元素，则允许在该类型的合作伙伴上可见的元素类型1将显示以下元素：<input type="text" id="partner" name="partner" class=&…

JavaScript将PHP中的字符串和整数传递给函数 - javascript

我正在尝试将字符串和整数都传递到同一函数中，但是引号引起了问题。我发现错误出在echo $q->info部分，我必须在此代码上使用双引号。有人可以帮我写这个$q->info，但不能获得真正的价值吗？到目前为止，我的代码是<td><a href="javascript:add(<?php echo $q->i…

Telerik单选按钮所需的字段验证器 - javascript

如何设置Telerik单选按钮所需的字段验证器？我想在按钮单击“ BtnSave”上设置必填字段验证器吗？请帮忙！<telerik:RadButton ID="radio_male" runat="server" ToggleType="Radio" AutoPostBack="fa…

表单不提交或按钮提交不起作用 - javascript

据我所知，此代码必须有效，但是我编码时却无效问题在于该表单未提交。我该如何解决？选中时，我什至没有得到复选框的值。<table id="example" class="display" cellspacing="0" width="100%"> <thead&g…