Question

我想仅在单选按钮值更改时显示提交按钮。我将有几个无线电组，如果任何单选按钮改变，按钮应该出现！此外，如果单选按钮组值达到默认值，则提交按钮将再次隐藏。

$("form :radio").live('change',function(){

});

我的新代码：

//hide the submit button on load
        $('form :submit').hide();

        //Data structure where the initial value from radio button(s) will be stored
        var dbRadios = [];

        //Getting the initial values from the radio button(s) and load them to the data structure
        $("form :radio:checked").each(function() {
            dbRadios.push($(this).attr('value'));
        });


        //Attach onclick event to radio button(s)
        $('form :radio').click(function() {

            //The event fired, therefore the "New value(s)" (radio button value(s))  will be stored in the data sctructure
            var submitedRadios = [];

            //Geting the values from checked radio buttons
            $("form :radio:checked").each(function() {
                submitedRadios.push($(this).attr('value'));
            });

            //Now comparing both data structures
            if(dbRadios.compare(submitedRadios)){
                $('form :submit').fadeOut('slow');
            }else{
                $('form :submit').fadeIn('slow', function(){ ACTION! WILL BE EXECUTED MANY TIMES AS BUTTONS CLICKED});
            }

        });


        $("form").submit(function () {
        //AJAX GOES HERE!   
        alert("a submeter dados");  
        })

比较功能：

//Compare two different arrays
    Array.prototype.compare = function(testArr) {
        if (this.length != testArr.length) return false;
        for (var i = 0; i < testArr.length; i++) {
        if (this[i].compare) { 
            if (!this[i].compare(testArr[i])) return false;
        }
        if (this[i] !== testArr[i]) return false;
        }
        return true;
    }

Answer 1

您可以尝试以下内容。您可以编写更具体的逻辑以满足您的要求。

$(document).ready(function () {

   //hide the submit button on load
   $('form :submit').hide();

   var defaultVal = 'default';

   //attach onchange event to radio buttons
   $('form :radio').change(function() {
       var val = $(this).val();

       if(val!=defaultVal) {
         $('form :submit').show();
       } else {
         $('form :submit').hide();
       }
   });

});

上面的代码将根据点击/更改的单选按钮的当前值显示/隐藏提交按钮。

Answer 2

您可以尝试在onclick中使用逻辑绑定onclick以查看它是否与

不同

Answer 3

效果很好！

//Attach onclick event to radio button(s)
        $('form :radio').click(function() {
            //Every new event clears the array so the new values can be stored properly
            submitedRadios = [];
            //Geting the values from checked radio buttons every time the state modifies
            $("form :radio:checked").each(function() {
                submitedRadios.push($(this).attr('value'));
            });

            //Now comparing both data structures, if equal submit button hides, else shows
            if(dbRadios.compare(submitedRadios)){
                $('form :submit').fadeOut('slow');
            }else{
                $('form :submit').fadeIn('slow');
            }
        });

在更改单选按钮状态显示提交按钮...如何？

3 个答案: