移动DIV内容

时间:2013-12-29 09:35:57

标签: javascript jquery html

我回顾了街区周围的一些样本,但没有什么是清楚的。我的问题如下:(细分为TEST1,TEST2是动态生成的)

FILE1.PHP

<div id="MAINLeft">
  <div id="TEST1">
    <form method="post">
      <select name="Select1"
        onchange="AssignOrder(this.options[this.selectedIndex].value,TEST1)">
        <option value="A1">Name1</option>
        <option value="B1">Name2</option>
        <option selected="selected">------Select------</option>
      </select>
    </form>
  </div>
  <div id="TEST2">
    <form method="post">
      <select name="Select2"
        onchange="AssignOrder(this.options[this.selectedIndex].value,TEST1)">
        <option value="A1">Name1</option>
        <option value="B1">Name2</option>
        <option selected="selected">------Select------</option>
      </select>
    </form>
  </div>
</div>
<div id="MAINRight">
</div>

所以基本上,我在后台执行ajax而不刷新页面并在MAINRIGHT DIV中显示结果,并将DIV隐藏在LEFTDIV中。

function AssignOrder(id,divid)
   {    
     jQuery.ajax({
     type: "GET",             
     url: 'AssignOrder.php',
     data: "id=" + id,
      success: function(data) {
       $('#MAINRight').append(data);
        $(divid).hide();
    }
 });    
 }

该功能完美无缺,但之后我想从RIGHTDIV中新显示的DIV中点击而不刷新页面并将DIV返回到LEFTDIV,并在MAINRIGHT DIV中删除DIV。

我使用了以下代码,但它似乎无法正常工作。

function CancelOrder(id)
   {    
    //to get the ajax content and display in div 
    jQuery.ajax({
    url: $(this).attr('href'),
    success: function(response){
      $(id).show();
    },
    complete: function(){$(this).remove();}
    });
    //stop refreshing to the page given in
    return false;
 }

RIGHTDIV中传输的DIV内有以下行:

<a href="OrderCancel.php?id=23" onclick="CancelOrder(id)">Cancel</a>

2 个答案:

答案 0 :(得分:0)

生成的html不知道id的含义。 OnClick(id),在生成这些链接时用正确的id替换它。

答案 1 :(得分:0)

如果您为链接指定了ID,然后将this.id传递给CancelOrder功能,那么它将起作用:

<a id="order-cancel-23" href="OrderCancel.php?id=23" onclick="CancelOrder(this.id)">Cancel</a>