使用jquery追加到class属性

Question

我正在使用jquery处理一个多步骤表单，我正在尝试添加类来计算我拥有的表单步骤。 目前我的Jquery正在为每个.step类添加step-0，step-1等类。

但我想将i计数器附加到已经存在单个属性的.step类，而不是添加整个类atttribute并具有2个属性。 虽然它必须简单，但我真的无法真正找到如何干净利落地做到这一点。

HTML：

<!--multistep form-->
<form id="multistepform" method="post">
    <div class="step">
        First name: <input type="text" name="firstname"><br>
        Last name: <input type="text" name="lastname">
    </div>

    <div class="step">
        First name: <input type="text" name="firstname"><br>
        Last name: <input type="text" name="lastname">
    </div>

    <div class="actions">
        <input type="submit" value="submit data">
    </div>
</form>

jQuery的：

$(document).ready( function() {
    var steps = $("#multistepform .step");

    var count = steps.length;

    steps.each(function(i) {
        $(this).addClass("step-" + i);
    })

});

Answer 1

您不能修改一个类，而是删除.step ，并添加.step-<i>类

steps.each(function(i) {
    $(this).removeClass('step').addClass("step-" + i);
})

Answer 2

jQuery不提供用于修改类名称的UI。

添加一个新的并删除旧的。

steps.each(function(i) {
    var el = $(this);
    el.addClass("step-" + i);
    el.removeClass("step");
})