Question

网络编程初学者。我在javascript和jquery下面追加动态div。问题是函数select_click在传递参数时不会被调用;但是在没有传递参数时调用它。使用jquery从附加的div之一调用函数。

<script type="text/javascript">
function select_click(icnt) {
    alert( "New Handler for .click() called.");
}

$(document).ready(function(){
  $('#submit_button').click(function()
  {
      var entry1="Name:Mickey";
      var entry2="Name:Mouse";
      var city1="From:Pune";
      var city2="To:Mumbai";
      var date="01/01/2015";
      $("#res").append('<div class="left_res" id="idx0" style="background:#236B8E;float:left;width:350px;text-align:left; padding:2px 2px;">'+entry1+'</div>');
      $("#res").append('<div class="right_res" id="idx1" style="background:#236B8E;float:right;width:350px;text-align:left; margin-right:0px;padding:2px 2px;">'+entry2+'</div>');
      $("#res").append('</br>');

      $("#res").append('<div class="left_res" id="idx2" style="background:#236B8E;float:left;width:350px;text-align:left;padding:2px 2px;">'+city1+' '+city2+'</div>');
      $("#res").append('<div class="right_res" id="idx3" style="background:#236B8E;float:right;width:350px;text-align:left; margin-right:0px;padding:2px 2px;">'+city1+' '+city2+'</div>');
      $("#res").append('</br>');

      $("#res").append('<div class="left_res" id="idx4" style="background:#236B8E;float:left;width:350px;text-align:left;padding:2px 2px;">'+date+'</div>');
      $("#res").append('<div class="right_res" id="idx5" style="background:#236B8E;float:right;width:350px;text-align:left; margin-right:0px;padding:2px 2px;">'+date+'</div>');
      $("#res").append('</br>');
      $("#res").append('<div>'+'</br>'+'</div>');

      $("#res").append('<div>'+'<a href="javascript:select_click(entry1);" class="tp" style="background:#236B8E;float:left;width:150px;text-align:left;padding:2px 2px;">'+'select'+'</a>'+'</div>');
      $("#res").append('<div class="right_res" id="idx6" style="background:#236B8E;float:right;width:350px;text-align:left; margin-right:0px;padding:2px 2px;">'+'select'+'</div>');

      $("#res").append('</br>');
      $("#res").append('<div>'+'</br>'+'</br>'+'</div>');

  });
});

Answer 1

Entry1作为TEXT传递，而不是您已分配的变量值，因为它的值未在您的追加函数中连接。尝试：

$("#res").append('<div>'+'<a href="javascript:select_click("' + entry1 + '");" class="tp" style="background:#236B8E;float:left;width:150px;text-align:left;padding:2px 2px;">'+'select'+'</a>'+'</div>');

然而，您的方法似乎有点缺陷。尝试将页面上的div添加为HTML - 然后在submitton_button点击中操纵其内容和可见性：

<div id="divAfterSubmit" style="display:none;">
    <div class="left_res" id="idx0" style="background:#236B8E;float:left;width:350px;text-align:left; padding:2px 2px;"></div>
    <div class="right_res" id="idx1" style="background:#236B8E;float:right;width:350px;text-align:left; margin-right:0px;padding:2px 2px;"></div>
    <br/>

    <div class="left_res" id="idx2" style="background:#236B8E;float:left;width:350px;text-align:left;padding:2px 2px;"></div>
    <div class="right_res" id="idx3" style="background:#236B8E;float:right;width:350px;text-align:left; margin-right:0px;padding:2px 2px;"></div>
    <br/>

    <div class="left_res" id="idx4" style="background:#236B8E;float:left;width:350px;text-align:left;padding:2px 2px;"></div>
    <div class="right_res" id="idx5" style="background:#236B8E;float:right;width:350px;text-align:left; margin-right:0px;padding:2px 2px;">'+date+'</div>
    <br/>

    <div><a id="linkToChange" href="#" class="tp" style="background:#236B8E;float:left;width:150px;text-align:left;padding:2px 2px;">select</a></div>
    <div class="right_res" id="idx6" style="background:#236B8E;float:right;width:350px;text-align:left; margin-right:0px;padding:2px 2px;">select</div>
    <br/>
</div>


$(document).ready(function(){
    $("#submit_button").click(function(e){
        var entry1 = "Name:Mickey";
        var entry2 = "Name:Mouse";
        var city1 = "From:Pune";
        var city2 = "To:Mumbai";
        var date="01/01/2015";

        var BothCities = city1 + ' ' + city2;

        $("#idx0").html(entry1);
        $("#idx1").html(entry2);
        $("#idx2").html(BothCities);
        $("#idx3").html(BothCities);
        $("#idx4").html(date);
        $("#idx5").html(date);

        //You can set the href of the anchor tag by using its ID to access the element:
        var hrefToSet = "javascript:select_click('" + entry1 + "');";
        $("#linkToChange").prop("href", hrefToSet);


        //Alternatively, you could bind the onclick event of linktoChange:
        $("#linkToChange").unbind("click"); //remove any previous bindings
        $("#linkToChange").on("click", fucntion(e){
            e.preventDefault();
            select_click(entry1);
            return false;
        });

    $("#divAfterSubmit").css("display", "block");
    });
});

通过jquery从附加的div传递函数值

1 个答案: