Как сделать форму, чтобы показать 3 вопроса одновременно

Я разработал анкету для опроса, в которой есть 13 вопросов. Все вопросы приходят только на одной странице, но я хочу показать только 3 вопроса одновременно, а затем еще 3 вопроса на следующей странице.Как сделать форму, чтобы показать 3 вопроса одновременно

Я понятия не имею, как это сделать. Пожалуйста, помогите мне в этом вопросе. благодаря

источник

2016-09-22 Arpit Gupta

Как вы хотите, набор из 3-х вопросов, чтобы сделать - нажав на кнопку 'next', или с помощью' paging'? –

щелкнув дальше следующий. было бы здорово, если бы вы помогли мне с некоторым примером кода. –

Этого код будет показывать только три пункта на время, и показать следующие три элемента при нажмите кнопку «Далее».

var currentPage = 0; 
var pages = 5; 
var itemsPerPage = 3; 
var $submitButton = $("button[type=submit]"); 
$("li h3").each(function(i, e){ 
    $(e).text((i + 1) + ") " + $(e).text()); 
}); 

$("#next").click(function() { 
    $("li") 
    //.css("background", "#FFF") 
    .hide(); 
    for(i = 1; i <= itemsPerPage; i++) { 
     $("li:nth-child(" + ((currentPage * itemsPerPage) + i) + ")") 
     //.css("background" , "red") 
     .show(); 
    } 
    if(currentPage == pages - 1) { 
     $submitButton.show(); 
    } else { 
     $submitButton.hide(); 
    } 
    if(currentPage < pages - 1) { 
    currentPage += 1; 
    } else { 
    currentPage = 0; 
    } 

}); 

$("#next").click();

Example on CodePen

источник

2016-09-22 16:22:22

это возможно, если кнопка отправки пришла только на последней странице –

См. Ссылку. Я реализовал это на codepen. –

Использования CSS проверил селектор Создание вкладок контейнеры Примечания: вход должен быть размещен непосредственно перед сНом контейнера

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>Tabs</title> 
    <style type="text/css"> 
    input:checked + div {display:block;} 
    .nod{display: none;} 
    label{display:inline-grid; border: solid 2px black; } 
    </style> 
</head> 
<body> 
    <p>Select one section</p> 
    <label for="select1">Section 1</label> 
    <label for="select2">Section 2</label> 
    <label for="select3">Section 3</label> 
    <input type="radio" name="tab" id="select1" class="nod" checked="checked" /> 
    <div id="tab1" class="nod">Text of 1<br />bla bla bla ...</div> 
    <input type="radio" name="tab" id="select2" class="nod" /> 
    <div id="tab2" class="nod">Text of 2<br />ipsem something</div> 
    <input type="radio" name="tab" id="select3" class="nod" /> 
    <div id="tab3" class="nod">Text of 3<br />Eat that you can and can that you cannot</div> 
</body> 
</html>

источник

2016-09-22 16:18:29 xhtml6

Как сделать форму, чтобы показать 3 вопроса одновременно

ответ

Смежные вопросы