如何使用引导和jQuery

  • Z时代
  • 2024-01-10
  • 分类：问答

需增加和基于我的文本框的值bootstrapaddClass和removeClass删除我使现场更改按钮。任何人都可以给我一些建议，如何做到这一点？如何使用引导和jQuery

JsFiddle

$(document).ready(function() { 
    $("#submitted").click(function() { 
     var text = $("#answer").val(); 
     var comparingText = "7"; 
     if (text == comparingText) { 
      $('#submitted').removeClass('disabled'); 
     }else{ 
      $('#submitted').removeClass('btn-primary'); 
      $('#submitted').addClass('btn-warning'); 
     } 
    }); 
}); 
<span>6 + 1 = </span><input style="width: 50px;" type="text" id="answer" value="" placeholder="" style="display: block;" /> 
<input class="btn btn-primary disabled" type="submit" id="submitted" name="submitted" value="Submit" />

编辑选择的解决方案

$(document).ready(function() { 
    $('#submitted') 
     .toggleClass('btn-danger disabled'); 
    $("#answer").keyup(function() { 
    var text = $(this).val(); 
    var comparingText = "7"; 
    var valid = text == comparingText; 
     $('#submitted') 
      .toggleClass('btn-primary', valid) 
      .toggleClass('btn-danger disabled', !valid); 
    }); 
});

回答：

你可以尝试使用：

$(document).ready(function() { 
    $("#answer").keyup(function() { 
     var text = $(this).val(); 
     var comparingText = "7"; 
     var valid = text == comparingText; 
     $('#submitted') 
      .toggleClass('btn-primary', valid) 
      .toggleClass('btn-danger disabled', !valid); 
    }); 
});

回答：

你可以使用$ .change（）事件侦听器：

$(document).ready(function(){  
    // listen for change to #submitted element  
    $('#answer').change(function(){  
// things to do on change  
if ($('#answer').val() === '7'){  
    // things to do if the #answer text is 7  
    $('#submitted').removeClass('disabled');  
} else {  
    // things to do if the #answer text is not 7  
$('#submitted').addClass('disabled');  
};  
    });  
});

回答：

或者干脆你可以改变你的代码：

$(document).ready(function() { 
    $("#answer").keyup(function() { 
    var answer = $("#answer").val(); 
    var comparingText = 7; 
    if (answer == comparingText) { 
    $('#submitted').toggleClass('btn-primary').toggleClass('btn-danger disabled'); 
    } else { 
    $('#submitted').toggleClass('btn-primary',false).toggleClass('btn-danger disabled',true); 
    } 
    }); 
});

以上是 如何使用引导和jQuery 的全部内容， 来源链接： utcz.com/qa/258352.html

回到顶部