Question

我有一个用jQuery修改的按钮，用于更改它的id和/或类。当它有一个特定的类并且用户单击该按钮时，它应该执行以下脚本：

$(document).ready(function() {
$(function() {
    $('.error').hide();
    $("#tilisiirtobtn").click(function() {
        alert("buttoni toimii");
        var Nimi =             $(".Nimi").val();
        var Osoite =           $(".Osoite").val();
        var Postinumero =      $(".Postinumero").val();
        var Postitoimipaikka = $(".Postitoimipaikka").val();
        var Puhelin =          $(".Puhelin").val();
        var Sahkoposti =       $(".Sahkoposti").val();
        var Filtteri =         /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
        $('.error').hide();
        if(Nimi == ""){
            $(".Nimi").focus();
            $("#Nimi-error").show();
            return false;
        }
        if(Osoite == ""){
            $(".Osoite").focus();
            $("#Osoite-error").show();
            return false;
        }
        if(Postinumero == ""){
            $(".Postinumero").focus();
            $("#Postinumero-error").show();
            return false;
        }
        if(Postitoimipaikka == ""){
            $(".Postitoimipaikka").focus();
            $("#Postitoimipaikka-error").show();
            return false;
        }
        if(Puhelin == ""){
            $(".Puhelin").focus();
            $("#Puhelin-error").show();
            return false;
        }
        if(Sahkoposti == ""){
            $(".Sahkoposti").focus();
            $("#Sahkoposti-error").show();
            return false;
        }

        $('.supernappula').attr('disabled', 'disabled');
      var data = $('#yhteystiedot').serializeArray();
      data.push( { name: 'cartContent', value: $('#emailedcart').html()});
      //alert (data);return false;
     $.ajax({
    type: "POST",
    data: data,
    url: "order/order.php",
    dataType: "html",
    error: function(){ if(confirm("Mitään ei näytä tapahtuvan. Päivitä sivu?") == true){ window.location.reload();} 
 },
    success: function() {
 alert("Onnistui");
        }


  });
  return false;

    });
  });        
});

但是，它甚至不会执行首先要做的警报。

以下是更改按钮的ID和类的代码：

$(function() {
    $("#paypal").click(function() {
        $(".yhteystiedot").slideUp(600);
        $(".toimitustapa").slideDown(600);
        $('form :input').val("");
        $('.supernappula').html("Maksa PayPalissa");
        $('.supernappula').addClass("simpleCart_checkout");
        $('.supernappula').attr("id", "checkoutbtn");
    }); 
    $("#tilisiirto").click(function() {
        $(".yhteystiedot").slideDown(600);
        $(".toimitustapa").slideDown(600);
        $('.supernappula').html("Tee tilisiirto");
        $('.supernappula').removeClass("simpleCart_checkout");
        $('.supernappula').attr("id", "tilisiirtobtn");

    }); 
    $("#postiennakko").click(function() {
        $(".yhteystiedot").slideDown(600);
        $(".toimitustapa").slideDown(600);
        $('.supernappula').html("Maksa postiennakolla");
        $('.supernappula').removeClass("simpleCart_checkout");
        $('.supernappula').attr("id", "postiennakkobtn");

    });


    $("#matkahuolto").click(function(){
        $(".maksu").slideDown(600);

    });
    $("#posti").click(function(){
        $(".maksu").slideDown(600);

    });

});

按钮本身没有修改：

<button type="button" id="checkoutbtn" class="simpleCart_checkout supernappula"></button>

这是整页的fiddle。

如果有人理解？

Answer 1

最有可能的解决方案是你需要使用jQuery的live函数而不是click。

使用click处理程序，它会按原样注册页面上的所有内容，并且不会为将来具有给定选择器的元素注册事件。

live通过现在和将来为所有元素添加事件处理程序来解决此问题。

http://api.jquery.com/live/

更改此行：

$("#tilisiirtobtn").click(function() {

到

$("#tilisiirtobtn").live('click', function() {

应该解决你的问题。

Here's a working jsFiddle

Answer 2

你是双重调用文件准备好了。您所需要的只是$(function()...而不是您放置的$(document).ready(function() {的包装。

jQuery脚本没有执行

2 个答案: