JJERY附加元素在ajax成功后不会自动切换

时间:2016-06-20 11:12:15

标签: jquery ajax append

我在点击事件上添加了一些表单。每个表单都有自己的提交按钮,通过ajax向PHP文件发送请求。在成功请求后,我想删除按下的按钮。

  

JQUERY VERSION:https://code.jquery.com/jquery-1.9.1.js

<button id="search-button" class="sbtn"> Create Buttons </button>

<div class="rs">
</div>

    $( document ).ready(function() {

      $(".sbtn").click(function(){
        var results = '<br><form><input  name="submit" id="mehide" type="submit" class="category_button_short" value="SEND TO PHP"/></form><br><form><input  name="submit" id="mehide" type="submit" class="category_button_short" value="SEND TO PHP"/></form><br><form><input  name="submit" id="mehide" type="submit" class="category_button_short" value="SEND TO PHP"/></form>';
        $('.rs').append(results);
      });

      $(document).on('click', ".category_button_short", function () {
        $.ajax({
          type: "POST",
          url: '/echo/html/',
          data: {
            html: "<p>Text echoed back to request</p>",
          },
          success: function(data)
          {
            alert(data);
            $(this.form).find('.category_button_short').hide();// doesn't work
            //here i want to vanish 'SEND TO PHP' which one is pressed.
            //$(this).hide();     
          }
        });

      return false;
      });
});

但按下的按钮并没有消失。如何在其父母形式中定位BUTTON?

这是JSFIDDLE

1 个答案:

答案 0 :(得分:3)

ajax函数内的

function update() { if (currentHeight>600) { $(".class").css({"background-color":"blue"}); } else { $(".class").css({"background-color":"transparent"}); } } setInterval(update, 10); 指向xhr选项对象,而不是当前元素。

this作为选项传递给ajax。

Updated Fiddle

另外,您是否尝试隐藏当前点击的元素?如果是这样,只需context : this即可。

$(this).hide()