Question

我希望我的输入使用jQuery链接到另一个输入，而所有3个输入都保留在他们的位置而不是消失。

Input 1 ->   Input 2 ->      Input 3 ->     
Selected    Choose option   Choose option

最后，当用户点击所有选项时，＆＃34; 转到按钮＆＃34;接下来会出现，并且里面会有一个独特的超链接。

像那样：

Input 1 ->   Input 2 ->      Input 3 ->     Go Button (with unique hyperlink to each selection)
Selected    Choose option   Choose option

我见过这个Add input text when option selected，但这不是我需要的，而是相反的。

类似于http://jsfiddle.net/Mm2mu/2/但没有收音机的东西。

在此处查看图片示例http://oi62.tinypic.com/kew60n.jpg

Answer 1

我只想补充一下：

$('input').hide();

http://jsfiddle.net/guinatal/Mm2mu/4/

Answer 2

一种解决方案是观察具有所有禁用的特定类的输入。检查它们是否已设置值并最终在同一表单中启用具有相同类的下一个输入。

$(document).ready(function() {
    var $forms = $('form');

    $forms.each(function(){

        var $form = $(this);

        // scan each form for inputs with .input-step class
        var $steps = $(this).find('.input-step');
        if ( $steps.length > 0 ) {
            $steps.not(':first').prop('disabled', true);
            $steps.change(function(){
                var val = $(this).val();
                if ( val !== '' ) {
                    checkSubmitAvailability($form);
                    $form.find('.input-step:disabled:first').prop('disabled', false);
                }
            });
        }

    });
});

// Checks if all steps were made
// eventually enables submit actions
function checkSubmitAvailability($form) {
    if ($form.find('.input-step:disabled').length === 0 ) {
        $form.find('.input-finish').each(function(){
            $(this).removeClass('hidden');
            if ( typeof $(this).attr('href') !== 'undefined' ) {
                // element has attribute href, add data to this attribute
                var data = $form.find('.input-step');
                $(this).attr('href', $(this).attr('href') + '?' + data.serialize());
            }
        });
    }
}

我在这里使用一个表单作为范围并输入类“input-step”，但这可能是其他任何一个。

这是一个小提琴http://jsfiddle.net/hMEad/19/

链接选择输入到另一个输入

2 个答案: