在页面加载时调用一次函数，然后在用户单击时调用

Question

我必须编写一个在折扣前计算价格的代码。它必须执行一次，在页面首次加载时自动执行，然后监听输入字段中的更改。这是我到目前为止所做的。它遗憾地只运行一次。 谁能告诉我如何正确地做到这一点

function promo_price()
{

    jQuery(".form-basket" ).ready(function() {
        var cena = 0;
        var procent = jQuery('#przecenajs').attr("data-procent");
        var stara_Cena=0;
        cena = parseInt(cena);
        procent = procent/100;
        console.log(procent);
        console.log(cena);
        cena = jQuery('.main-price').html();
        console.log(cena);
        cena = cena.substring(0, 5);
        console.log(cena);
        cena= parseInt(cena.split(',').join('.'));
        console.log(cena);

        if (!isNaN(procent) && procent!=0 ) {
            stara_Cena = parseInt(cena * procent+ cena);
                console.log('stara cena procent'+stara_Cena);
             $('.staraCena').remove();
           jQuery('.dostepny3d').append('<span class="staraCena"><del>'+stara_Cena+',00</del></span>');
        }
        else if (isNaN(procent) || procent==0 ){
                 $('.staraCena').html(" ");
        }
    });
}
promo_price();
$('.form-basket').on("click",promo_price);

Answer 1

将整个代码放在$(document).ready()内，而不是在函数内使用.ready()。

$(document).ready(function() {
    function promo_price() {
        var cena = 0;
        var procent = jQuery('#przecenajs').attr("data-procent");
        var stara_Cena=0;
        cena = parseInt(cena);
        procent = procent/100;
        console.log(procent);
        console.log(cena);
        cena = jQuery('.main-price').html();
        console.log(cena);
        cena = cena.substring(0, 5);
        console.log(cena);
        cena= parseInt(cena.split(',').join('.'));
        console.log(cena);

        if (!isNaN(procent) && procent!=0 ) {
            stara_Cena = parseInt(cena * procent+ cena);
                console.log('stara cena procent'+stara_Cena);
             $('.staraCena').remove();
           jQuery('.dostepny3d').append('<span class="staraCena"><del>'+stara_Cena+',00</del></span>');
        }
        else if (isNaN(procent) || procent==0 ){
                 $('.staraCena').html(" ");
        }
    }
    promo_price();
    $('.form-basket').on("click",promo_price);
}

Answer 2

.ready()来电不应该在您的功能中。

您可以先定义promo_price()函数，然后等待DOM完全加载。然后调用promo_price()并定义您的点击事件处理程序。

＆＃13;

＆＃13;

function promo_price() {

  var cena = 0;
  var procent = jQuery('#przecenajs').attr("data-procent");
  var stara_Cena = 0;
  cena = parseInt(cena);
  procent = procent / 100;
  console.log(procent);
  console.log(cena);
  cena = jQuery('.main-price').html();
  console.log(cena);
  cena = cena.substring(0, 5);
  console.log(cena);
  cena = parseInt(cena.split(',').join('.'));
  console.log(cena);

  if (!isNaN(procent) && procent != 0) {
    stara_Cena = parseInt(cena * procent + cena);
    console.log('stara cena procent' + stara_Cena);
    $('.staraCena').remove();
    jQuery('.dostepny3d').append('<span class="staraCena"><del>' + stara_Cena + ',00</del></span>');
  } else if (isNaN(procent) || procent == 0) {
    $('.staraCena').html(" ");
  }

}

jQuery(document).ready(function() {
  promo_price();
  $('.form-basket').on("click", promo_price);
});

＆＃13;

＆＃13;

＆＃13;

Answer 3

这是事件处理程序的基本概念。您当然可以通过使用jquery等来增强它，例如将第一个单击处理程序放在$（document）.ready中 - 尤其是在引用DOM元素时。

random-number-generator()?permute($words)[position()=1 to 10]

clickHandler(null);

function clickHandler(e) {
  console.log('clicked button with text: ' + (e ? e.target.value : null));
}

Answer 4

• 您不需要将函数声明放在ready函数
中
• 在函数ready内放置dom，事件绑定，函数执行等操作。
• 将jQuery function替换为jQuery符号：$

function promo_price() {
    var cena = 0;
    var procent = $('#przecenajs').data("procent");
    var stara_Cena = 0;
    cena = parseInt(cena);
    procent = procent / 100;
    console.log(procent);
    console.log(cena);
    cena = jQuery('.main-price').html();
    console.log(cena);
    cena = cena.substring(0, 5);
    console.log(cena);
    cena = parseInt(cena.split(',').join('.'));
    console.log(cena);

    if (!isNaN(procent) && procent != 0) {
        stara_Cena = parseInt(cena * procent + cena);
        console.log('stara cena procent' + stara_Cena);
        $('.staraCena').remove();
        $('.dostepny3d').append('<span class="staraCena"><del>' + stara_Cena + ',00</del></span>');
    } else if (isNaN(procent) || procent == 0) {
        $('.staraCena').html(" ");
    }
}

$(document).ready(function() {
    promo_price();
    $('.form-basket').on("click", promo_price);
});

资源

.ready()

  

指定在DOM完全加载时要执行的函数。

jQuery提供了几种附加在DOM准备就绪时运行的函数的方法。以下所有语法都是等效的：

• $( handler )
• $( document ).ready( handler )
• $( "document" ).ready( handler )
• $( "img" ).ready( handler )
• $().ready( handler )