点击时jQuery上一个按钮回到Q.）1而不是一个一个地向后 [英] jQuery previous button when clicked goes back to Q.) 1 rather then going backward one by one

问题描述

jQuery上一个按钮不能按预期工作。

基本上解释它的最好方法是如果我在问题5中，并且单击上一个按钮，它将默认为问题1，而不是回答问题4，

所以这是默认的问题1 ...这是一个问题。 b $ b

jQuery位于脚本标记的底部。

  if（i.Question_Type ==DROPDOWN） 
 {
< div class =container text-center> 
 
< div class =row idrowdata-questions =@ counter> 
 @ {
 counter ++; 
} 
 
< div id =question1class =form-group> 
< label class =lab text-centerfor =form-group-select> 
 @ i.Question_Order @ Html.Raw（@ i.Question）
< / label> 
  @for（int x = 1; x <= Convert.ToInt32（i.Question_SubType）; x ++）
 {
 var t = x  -  1; 
 if（i.qOps！= null）
 {
< option> @ i.qOps.options [T]< /选项> 
} 
 else 
 {
< option> @ X< /选项> 
} 
} 
< / select> 
< / div> 
< / div> 
< / div> 
} 
 
 if（i.Question_Type ==RADIO）
 {
 
< div class =container> 
< div class =row idrowdata-questions =@ counter> 
 @ {counter ++; 
} 
< div class =form-group> 
< label class =labfor =questions> 
 @ i.Question_Order @ i.Question 
< / label> 
< div class =row> 
< div class =col-xs-12> 
< div id =question1class =radio-inline> 
 @for（int x = 1; x <= Convert.ToInt32（i.Question_SubType）; x ++）
 {
 var t = x  -  1; 
 if（i.qOps！= null）
 {
< label class =radio-inline>< input type =radioname =question> @ i.qOps.options [T]< /标签> 
} 
 else 
 {
< label class =radio-inline>< input type =radiomin =0max =@ x NAME = 问题 >< /标签> 
} 
} 
< / div> 
< / div> 
< / div> 
< / div> 
< / div> 
< / div> （i.Question_Type ==CHECKBOX）
 {
 for（int y = 1; y< = Convert.ToInt32（i。 Question_SubType）; y ++）
 {
 @ *< div class =container> 
< div class =row> 
 
< label> @ y< / label> < input type =checkboxname =question> 
 
< / div> 
< / div> * @ 
} 
} 
} 
< div class =azibsButtons> 
< button type =buttonid =previousclass =btn btn-primary pull-left>上一个< / button> 
 
< button type =buttonid =nextclass =btn btn-primary pull-right> Next< / button> 
< / div> 
 
 
< script> 
 $（document）.ready（function（）{
 $（。idrow）。each（function（i）{
 
 var inner = $（this）。 data（'questions'）; 
 if（inner == 0）{
 
 $（this）.removeClass（'hidden'）; 
} else {
 $（this）.addClass（'hidden'）; 
 
 
））; 
 $（＃next）。click（function（）{
 （b）b $ b $（。idrow）。each（function（i）{
 
 var inp = $（this）; 
 if（！inp.hasClass（'hidden'）） ）{
 var dataVal = inp.data（questions）; 
 dataVal ++; 
 inp.addClass（'hidden'）; 
 
 $（'[data （'hidden'）; 
 
 return false; 
 $ b} 
}）; 
 
 $（＃previous）。click（function（）{
 
 $（。idrow）。each（function（i）{
 
 var inp = $（this）; 
 if（！inp.hasClass（'hidden'））{
 var dataVal = inp.data（questions）; 
 dataVal - ; 
 inp.addClass（'hidden'）; 
 
 $（'[data-questions ='+ dataVal +']'）。removeClass（'hidden'）; 
 
返回false; 
 
} 
}）; 
}）; 
}）; 
}）; 
< / script> 
  
 
 
解决方案
我得到了解决方案感谢Daniel。
 
 
 
下一个事件关闭大括号包裹在前一个事件中，导致问题在单击前一个时默认为问题1。 
  $（＃next）。click（function（）{
 
 $（。 idrow）。each（function（i）{
 
 var inp = $（this）; 
 if（！inp.hasClass（'hidden'））{
 var dataVal = inp.data（questions）; 
 dataVal ++; 
 inp.addClass（'hidden'）; 
 
 $（'[data-questions ='+ dataVal +' ]'）。removeClass（'hidden'）; 
 
 return false; 
} 
}）; 
}）; 
 
 $（＃previous）。click（function（）{
 
 $（。idrow）。each（function（i）{
 
 var inp = $（this）; 
 if（！inp.hasClass（'hidden'））{
 var dataVal = inp.data（questions）; 
 dataVal- - ; 
 inp.addClass（'hidden'）; 
 
 $（'[data-questions ='+ dataVal +']'）。removeClass（'hidden'）; 
 
返回false; 
} 
}）; 
}）; 
  
 
jQuery previous button not working as expected.

Basically the best way to explain it is if I'm on question 5 and I click the previous button, it defaults to question 1 rather than going to question 4.

So it's defaulting to question 1... That's a problem.

What to do?

jQuery is in the bottom in script tags.
  if (i.Question_Type == "DROPDOWN")
  {
    <div class="container text-center">

      <div class="row idrow" data-questions="@counter">
        @{
          counter++;
        }

        <div id="question1" class="form-group">
          <label class="lab text-center" for="form-group-select">
            @i.Question_Order @Html.Raw(@i.Question)
          </label>
          <select class="form-control" id="form-group-select">
            @for (int x = 1; x <= Convert.ToInt32(i.Question_SubType); x++)
            {
              var t = x - 1;
              if (i.qOps != null)
              {
                <option> @i.qOps.options[t]</option>
              }
              else
              {
                <option> @x</option>
              }
            }
          </select>
        </div>
      </div>
    </div>
  }

  if (i.Question_Type == "RADIO")
  {

    <div class="container">
      <div class="row idrow" data-questions="@counter">
        @{counter++;
        }
        <div class="form-group">
          <label class="lab" for="questions">
            @i.Question_Order @i.Question
          </label>
          <div class="row">
            <div class="col-xs-12">
              <div id="question1" class="radio-inline">
                @for (int x = 1; x <= Convert.ToInt32(i.Question_SubType); x++)
                {
                  var t = x - 1;
                  if (i.qOps != null)
                  {
                  <label class="radio-inline"><input type="radio" name="question"> @i.qOps.options[t]</label>
                  }
                  else
                  {
                  <label class="radio-inline"><input type="radio" min="0" max="@x" name="question"></label>
                  }
                }
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

  }
  if (i.Question_Type == "CHECKBOX")
  {
    for (int y = 1; y <= Convert.ToInt32(i.Question_SubType); y++)
    {
      @*<div class="container">
      <div class="row">

        <label>@y</label>   <input type="checkbox" name="question">

      </div>
      </div>*@
    }
  }
}
<div class="azibsButtons">
  <button type="button" id="previous"  class="btn btn-primary pull-left">Prev</button>

  <button type="button" id="next"  class="btn btn-primary pull-right">Next</button>
</div>


<script>
$(document).ready(function () {
  $(".idrow").each(function (i) {

    var inner = $(this).data('questions');
    if (inner == 0) {

      $(this).removeClass('hidden');
    } else {
      $(this).addClass('hidden');

    }
  });
  $("#next").click(function () {

    $(".idrow").each(function (i) {

      var inp = $(this);
      if (!inp.hasClass('hidden')) {
        var dataVal = inp.data("questions");
        dataVal++;
        inp.addClass('hidden');

        $('[data-questions=' + dataVal + ']').removeClass('hidden');

        return false;

      }
    });

    $("#previous").click(function () {

      $(".idrow").each(function (i) {

        var inp = $(this);
        if (!inp.hasClass('hidden')) {
          var dataVal = inp.data("questions");
          dataVal--;
          inp.addClass('hidden');

          $('[data-questions=' + dataVal + ']').removeClass('hidden');

          return false;

        }
      });
    });
  });
});
</script>

解决方案
Hey guys I got the solution Thanks to Daniel.

The next event closing braces were wrapped around the previous event, which caused the problem to default to question 1 when clicked previous. 
$("#next").click(function () {

  $(".idrow").each(function (i) {

    var inp = $(this);
    if (!inp.hasClass('hidden')) {
      var dataVal = inp.data("questions");
      dataVal++;
      inp.addClass('hidden');

      $('[data-questions=' + dataVal + ']').removeClass('hidden');

      return false;
    }
  });
});

$("#previous").click(function () {

  $(".idrow").each(function (i) {

    var inp = $(this);
    if (!inp.hasClass('hidden')) {
      var dataVal = inp.data("questions");
      dataVal--;
      inp.addClass('hidden');

      $('[data-questions=' + dataVal + ']').removeClass('hidden');

      return false;
    }
  });
});


                        
这篇关于点击时jQuery上一个按钮回到Q.）1而不是一个一个地向后的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
                        
                    
                    
                
				

                            
                        
                

            
        
        

            



        
        
        

            



        
    
    


    

    

        

            登录
            关闭
        
        

            

                扫码关注1秒登录
            
            

                
            
            

                
                
            

发送“验证码”获取 | 15天全站免登陆

友情链接： IT屋 Chrome插件 谷歌浏览器插件

IT屋 ©2016-2022 琼ICP备2021000895号-1 站点地图 站点标签 SiteMap <免责申明> 本站内容来源互联网,如果侵犯您的权益请联系我们删除.