滑块值在幻灯片上更改，但不会在单击时更改

Question

我在Wordpress网站上有一个滑块，它的自定义代码不是插件。当我滑动滑块时，值会更改，但是当我单击时，没有任何反应。我想在滑动或点击时滑块工作。

以下是代码：

jQuery("#ex1").slider();
jQuery("#ex1").on("slide", function(slideEvt) {
    var pret = jQuery("#pret").val();
    var mois = slideEvt.value;
    var final = 0
    var annee = 0
    var nbmois = 0
    var pretlong = false

    if(mois>12){
        nbmois = mois%12
        final = pret*1.039
        annee = mois/12
        annee = Math.floor(annee)
        pretlong = true
        console.log(annee)
    }else
        final=pret

    final = final / mois
    console.log(pret)
    console.log(mois)
    console.log(final)

    if(pretlong)
        jQuery("#mois").text(mois+" mois (soit "+annee+" an(s) et "+nbmois+" mois)");
    else
        jQuery("#mois").text(mois+" mois");

    jQuery("#montant").text(final.toFixed(2) + "€ TTC sur "+mois+" mois");
});

如果你能帮助我，我将不胜感激。这是它出现的链接。 http://www.smf-services.fr/habitat/simulateur-financement/

Answer 1

没有任何官方方式这样做[Atleast我还没找到一个]恕我直言。但是，您可以使用插件的 change event ，并将更新代码移到单独的function中，然后将值传递给update并调用change和slide事件的功能。 change事件的参数值为object。该对象包含old value和new value，您可以使用它们。请考虑以下示例。

jQuery("#ex1").on("slide", function(slideEvt) {
    //moved code from here into a separate function below named updateValue
    //which accepts value as parameter
    updateValue(slideEvt.value);//call the function
}).on('change', function(val) {
    //val parameter above has value object which contains newValue 
    updateValue(val.value.newValue);
});

function updateValue(value) {
    var pret = jQuery("#pret").val();
    var mois = value;
    var final = 0
    var annee = 0
    var nbmois = 0
    var pretlong = false
    if (mois > 12) {
        nbmois = mois % 12
        final = pret * 1.039
        annee = mois / 12
        annee = Math.floor(annee)
        pretlong = true
    } else
        final = pret
    final = final / mois
    if (pretlong)
        jQuery("#mois").text(mois + " mois (soit " + annee + " an(s) et " + nbmois + " mois)");
    else
        jQuery("#mois").text(mois + " mois");

    jQuery("#montant").text(final.toFixed(2) + "€ TTC sur " + mois + " mois");

}

<强>

的 DEMO HERE