Question

HTML：

<div id="payment_group">
    <div class="col-md-6">
        <div class="form-group form-md-line-input">
            <label for="form_control_1">Paid Amount</label>
            <input type="number" class="form-control" step="0.01" id="Paid_amount" name="Paid_amount" style="" value="">
        </div>
    </div>
    <div class="col-md-6">
        <div class="form-group form-md-line-input" style="margin-bottom: 0px">
            <label>Payment Mode</label>
            <select class="form-control selectpicker" data-live-search="true" name="Payment_mode" id="Payment_Mode" onchange="show_bank()">
                <option value="">Select Payment Mode</option>
                <option value="Cash">Cash</option>
                <option value="Card">Card</option>
                <option value="Credit">Credit</option>
            </select>
        </div>
    </div>
</div>

如何使用jQuery将col-md-6替换为div id payment_group中的col-md-4？抱歉我的英语不好。

Answer 1

通常情况下，您可以这样做：

$('#payment_group .col-md-6').toggleClass('col-md-6 col-md-4');
//Or
$('#payment_group .col-md-6').addClass("col-md-4").removeClass("col-md-6"‌);

切换选项不是最好的，它会添加一个类（如果它不存在）并删除它，如果它...它更简洁一点......

Answer 2

<div id="payment_group">
<div class="col-md-6" id="changeclass">
    <div class="form-group form-md-line-input">
        <label for="form_control_1">Paid Amount</label>
        <input type="number" class="form-control" step="0.01" id="Paid_amount" name="Paid_amount" style="" value="">
    </div>
</div>

添加一个名为=＆＃34;更改类＆＃34;对于col-md-6 div

然后在jquery

$("#changeclass").toggleClass('col-md-4');

Answer 3

您可以使用$("#payment_group .col-md-6").addClass("col-md-4").removeClass("col-md-6")

工作演示

$("#payment_group .col-md-6").addClass("col-md-4").removeClass("col-md-6")
console.log("elements with class col-md-4: " + $("#payment_group .col-md-4").length)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="payment_group">
    <div class="col-md-6">
        <div class="form-group form-md-line-input">
            <label for="form_control_1">Paid Amount</label>
            <input type="number" class="form-control" step="0.01" id="Paid_amount" name="Paid_amount" style="" value="">
        </div>
    </div>
    <div class="col-md-6">
        <div class="form-group form-md-line-input" style="margin-bottom: 0px">
            <label>Payment Mode</label>
            <select class="form-control selectpicker" data-live-search="true" name="Payment_mode" id="Payment_Mode" onchange="show_bank()">
                <option value="">Select Payment Mode</option>
                <option value="Cash">Cash</option>
                <option value="Card">Card</option>
                <option value="Credit">Credit</option>
            </select>
        </div>
    </div>
</div>

Answer 4

使用addClass（）和removeClass（）

＆＃13;

$("#payment_group .col-md-6").addClass('col-md-4').removeClass('col-md-6')

＆＃13;

.col-md-4 {
  color: red
}

.col-md-6 {
  color: blue
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="payment_group">
  <div class="col-md-6">
    <div class="form-group form-md-line-input">
      <label for="form_control_1">Paid Amount</label>
      <input type="number" class="form-control" step="0.01" id="Paid_amount" name="Paid_amount" style="" value="">
    </div>
  </div>
  <div class="col-md-6">
    <div class="form-group form-md-line-input" style="margin-bottom: 0px">
      <label>Payment Mode</label>
      <select class="form-control selectpicker" data-live-search="true" name="Payment_mode" id="Payment_Mode" onchange="show_bank()">
                <option value="">Select Payment Mode</option>
                <option value="Cash">Cash</option>
                <option value="Card">Card</option>
                <option value="Credit">Credit</option>
            </select>
    </div>
  </div>
</div>

＆＃13;

Answer 5

您可以设置班级，无论其是什么。

$("#payment_group .col-md-6").attr("class", "class-name-you-want-to-assign");

Answer 6

$("#payment_group").find(".col-md-6").addClass("col-md-4");
$("#payment_group").find(".col-md-6").removeClass(".col-md-6");

Answer 7

试试这个

$( "#payment_group div:first-child" )
    $( this ).removeClass( ".col-md-6" );
    $( this ).addClass( ".col-md-4" );
});

由于

Answer 8

尝试此操作以删除课程

$(selector).removeClass(classname,function(index,currentclass))

并添加

$(selector).addClass(classname,function(index,currentclass))

You can check w3schools site here.

and for add class, check this.

Answer 9

我认为这也会对你有所帮助！

＆＃13;

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
   <script type="text/javascript">
       $(document).ready(function () {
               $('#payment_group .col-md-6').toggleClass('col-md-6 col-md-4');
           });     
   </script>
</head>
<body>
    <div id="payment_group">
        <div class="col-md-6">
            <div class="form-group form-md-line-input">
                <label for="form_control_1">Paid Amount</label>
                <input type="number" class="form-control" step="0.01" id="Paid_amount" name="Paid_amount" style="" value="">
            </div>
        </div>
        <div class="col-md-6">
            <div class="form-group form-md-line-input" style="margin-bottom: 0px">
                <label>Payment Mode</label>
                <select class="form-control selectpicker" data-live-search="true" name="Payment_mode" id="Payment_Mode" onchange="show_bank()">
                    <option value="">Select Payment Mode</option>
                    <option value="Cash">Cash</option>
                    <option value="Card">Card</option>
                    <option value="Credit">Credit</option>
                </select>
            </div>
        </div>
    </div>
    <button id="gete">Submit</button>
</body>
</html>

＆＃13;

Answer 10

您可以使用jQuery＆＃39; addClass和removeClass：

public class Main { public static void main(String a[]) { TreeMap<String, String> map = new TreeMap<String, String>(new CustomComparator()); map.put("100_101", "lll"); map.put("100_103", "lll"); map.put("100_101_102", "lll"); map.put("100_101_104", "lll"); map.put("100", "lll"); System.out.println(map); } } class CustomComparator implements Comparator<String> { @Override public int compare(String str1, String str2) { int a, b; //Used this because your key may or may not contain "_" if (str1.contains("_")) { a = Integer.parseInt(str1.substring(str1.lastIndexOf('_') + 1)); } else { a = Integer.parseInt(str1); } if (str2.contains("_")) { b = Integer.parseInt(str2.substring(str2.lastIndexOf('_') + 1)); } else { b = Integer.parseInt(str2); } // System.out.println(Integer.parseInt(str1.substring(str1.lastIndexOf('_')+1))+"---"+Integer.parseInt(str2.substring(str2.lastIndexOf('_')+1))); return String.valueOf(a).compareTo(String.valueOf(b)); } }

如何替换div id中的类名？

10 个答案: