null
// add img in hidden state then fade
// copy title and alt attributes from small img to new one
jQuery(document).ready(function() {
jQuery(".load-on-click").click(function() {
jQuery(this).text("Loading").removeClass("btn-default, btn-primary, btn-success, btn-info, btn-danger, btn-link").addClass("btn-warning");
//change btn class to btn warning
});
});
<html id="ntc-web-my" lang="en" dir="ltr" prefix="content: http://purl.org/rss/1.0/modules/content/ dc: http://purl.org/dc/terms/ foaf: http://xmlns.com/foaf/0.1/ og: http://ogp.me/ns# rdfs: http://www.w3.org/2000/01/rdf-schema# sioc: http://rdfs.org/sioc/ns# sioct: http://rdfs.org/sioc/types# skos: http://www.w3.org/2004/02/skos/core# xsd: http://www.w3.org/2001/XMLSchema#"
class="js">
<head profile="http://www.w3.org/1999/xhtml/vocab">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="shortcut icon" href="https://failover.northtyneside.gov.uk/sites/default/files/favicon_0.ico" type="image/vnd.microsoft.icon">
<meta name="generator" content="Drupal 7 (https://www.drupal.org)">
<link rel="canonical" href="https://failover.northtyneside.gov.uk/facility/938">
<link rel="shortlink" href="https://failover.northtyneside.gov.uk/node/938">
<link type="text/css" rel="stylesheet" href="https://failover.northtyneside.gov.uk/sites/default/files/css/css_lQaZfjVpwP_oGNqdtWCSpJT1EMqXdMiU84ekLLxQnc4.css" media="all">
<link type="text/css" rel="stylesheet" href="https://failover.northtyneside.gov.uk/sites/default/files/css/css_y5V-74fl2u3TPnO7Vzl0srF2_LEAmcANj4_-6qPJyxk.css" media="all">
<link type="text/css" rel="stylesheet" href="https://failover.northtyneside.gov.uk/sites/default/files/css/css_6wBOCOFxVtHYT2hpGMbeDQ312q-jxDxgASHWdm3WYi4.css" media="all">
<link type="text/css" rel="stylesheet" href="https://failover.northtyneside.gov.uk/sites/default/files/css/css_gwWRemXWt3xYLQ0FjqVRBTD7b5PQL91v8BAu8J2qKjk.css" media="all">
<style>
#backtotop {
left: 10px;
}
</style>
<link type="text/css" rel="stylesheet" href="https://failover.northtyneside.gov.uk/sites/default/files/css/css_-U-YIgj5NQz73QbwdRP7JBqbYW5aUP8ZJhZOII6t4oY.css" media="all">
<link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.5/dist/css/bootstrap.min.css" media="all">
<link type="text/css" rel="stylesheet" href="https://failover.northtyneside.gov.uk/sites/default/files/css/css_47DEQpj8HBSa-_TImW-5JCeuQeRkm5NMpJWZG3hSuFU.css" media="all">
<!--[if lt IE 10]>
<link type="text/css" rel="stylesheet" href="https://failover.northtyneside.gov.uk/sites/default/files/css/css_47DEQpj8HBSa-_TImW-5JCeuQeRkm5NMpJWZG3hSuFU.css" media="all" />
<![endif]-->
<!--[if lt IE 9]>
<link type="text/css" rel="stylesheet" href="https://failover.northtyneside.gov.uk/sites/default/files/css/css_47DEQpj8HBSa-_TImW-5JCeuQeRkm5NMpJWZG3hSuFU.css" media="all" />
<![endif]-->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
<link rel="stylesheet" href="https://failover.northtyneside.gov.uk/sites/default/files/css-overrides/overrides.min.css">
<link rel="stylesheet" href="https://failover.northtyneside.gov.uk/sites/default/files/css-overrides/legacy-overrides.min.css">
<button class="btn btn-primary load-on-click form-submit ajax-processed" type="submit" id="edit-find" name="op" value="Find">Find</button>
<!-- Standard button -->
<button type="button" class="btn btn-default load-on-click form-submit ajax-processed">Default</button>
<!-- Provides extra visual weight and identifies the primary action in a set of buttons -->
<button type="button" class="btn btn-primary load-on-click form-submit ajax-processed">Primary</button>
<!-- Indicates a successful or positive action -->
<button type="button" class="btn btn-success load-on-click form-submit ajax-processed">Success</button>
<!-- Contextual button for informational alert messages -->
<button type="button" class="btn btn-info load-on-click form-submit ajax-processed">Info</button>
<!-- Indicates caution should be taken with this action -->
<button type="button" class="btn btn-warning load-on-click form-submit ajax-processed">Warning</button>
<!-- Indicates a dangerous or potentially negative action -->
<button type="button" class="btn btn-danger load-on-click form-submit ajax-processed">Danger</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
null
大家好,我正在写一个函数来改变按钮的特定类,当点击按钮时,将文本改为“loading”,并将类改为“btn-warning”,使按钮的颜色变为橙色。 然而,当试图覆盖“危险”按钮时,它不会改变颜色从红色到橙色。 有人知道它为什么这样做或者如何修复它吗?
由此而来的这个问题
$("element").removeClass("class1 class2");
要从元素中移除的一个或多个CSS类,这些元素由空格分隔。
参考:http://docs.jquery.com/attributes/removeClass