0

我正在重建这个问题。我有以下 HTML 元素结构。

<li class="inner"><span class="plus" id="sidehome" title="siteHome">SiteHome</span>
<ul style="display:none">
  <li class="inner">
    <span class="plus" id="Middle_Content">Middle content</span>
    <ul style="display:none">
      <li>
        <span id="editedpart" title="first div">
          <form >
            <input type="hidden" value="1/middle_content/first_div" name="page_heri" id="t_div" class="" />
            <input type="hidden" name="editedpart" value="first div" id="edited" />
            <a href="#" title="edit" id="edit" onclick="showeditpage()">first div</a>
          </form>
        </span>
      </li>
      <li>
        <span id="editedpart" title="second div">
          <form>
            <input type="hidden" value="1/middle_content/first_div" name="page_heri" id="t_div" class="" />
            <input type="hidden" name="editedpart" value="second div" id="edited" />
            <a href="#" title="edit" id="edit" onclick="showeditpage()">second div</a>
          </form>
        </span>
      </li>
      <li>
        <span id="editedpart" title="third div">
          <form>
            <input type="hidden" value="1/middle_content/first_div" name="page_heri" id="t_div" class="" />
            <input type="hidden" name="editedpart" value="third div" id="edited" />
            <a href="#" title="edit" id="edit" onclick="showeditpage()">third div</a>
          </form>
        </span>
      </li>
    </ul>
  </li>

我希望能够获得<span> with的标题值，这是单击链接时标记id=editedpart的直接父级。<a>我不知道如何解释更多。如果有人可以提供帮助，我将不胜感激。谢谢。

我使用了他的 jQuery 代码var parent = $(this).closest("span");

这是我完整的showitpage()

function showeditpage(){
var page = document.getElementById("t_div").value;
var action = document.getElementById("edit").title;

var parent = $(this).closest("span[id='editedpart']");
var str =parent.attr('title');
if(window.XMLHttpRequest){
        xmlhttp = new XMLHttpRequest();
    }else{
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function(){
        if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
            document.getElementById("pcontent").innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","../views/edit.php?page="+page+"&action="+action+"&editedpart="+str);
    xmlhttp.send();

}

它不工作是它没有响应。

4

4 回答 4

1

你可以使用.attr方法：

var title = $(this).closest("span").attr('title');
于 2013-04-30T02:06:07.420 回答
1

您的问题是this没有引用函数中单击的a元素showeditpage。

尽管我不推荐它，但您可以使用以下方法解决您的问题：

<a onclick="showeditpage(this);" ...

function showeditpage(link) {
    alert($(link).closest("span").attr('title'));
}

但是，您应该避免使用属性附加事件处理程序并使用以下方法：

a在您的标签上放置一个类，edit例如（您也可以使用任何其他共享属性，如果有的话）。

<a class="edit" ...

等到document准备好并使用 jQuery 附加事件处理程序。

$(function () {
    $(document).on('click', '.edit', function (e) {
        alert($(this).closest("span").attr('title'));
        e.preventDefault(); //prevent default browser action
    });
});

另请注意，id应该是唯一的。

于 2013-04-30T02:26:17.087 回答
0

简单的：

 var parent = $(this).closest("span[id='editedpart']");
 var title = parent.attr('title');
于 2013-04-30T02:06:19.647 回答
0

您需要将单击的元素传递给处理程序方法onclick="showeditpage(this)"。

此外，ID 在页面中必须是唯一的，即只有一个元素应该具有给定的 ID。在您的情况下，我建议您将其editedpart作为一个类而不是 id 并使用var parent = $(this).closest(".editedpart");. 您还需要更改 idt_div和edit类。

您也可以修改方法以使用 jQuery

HTML

<li class="inner"><span class="plus" id="sidehome" title="siteHome">SiteHome</span>
<ul style="display:none">
  <li class="inner">
    <span class="plus" id="Middle_Content">Middle content</span>
    <ul style="display:none">
      <li>
        <span class="editedpart" title="first div">
          <form >
            <input type="hidden" value="1/middle_content/first_div" name="page_heri" class="t_div" />
            <input type="hidden" name="editedpart" value="first div" id="edited" />
            <a href="#" title="edit" class="edit" >first div</a>
          </form>
        </span>
      </li>
      <li>
        <span class="editedpart" title="second div">
          <form>
            <input type="hidden" value="1/middle_content/first_div" name="page_heri" class="t_div" />
            <input type="hidden" name="editedpart" value="second div" id="edited" />
            <a href="#" title="edit" class="edit" >second div</a>
          </form>
        </span>
      </li>
      <li>
        <span class="editedpart" title="third div">
          <form>
            <input type="hidden" value="1/middle_content/first_div" name="page_heri" class="t_div" />
            <input type="hidden" name="editedpart" value="third div" id="edited" />
            <a href="#" title="edit" class="edit" >third div</a>
          </form>
        </span>
      </li>
    </ul>
  </li>

脚本

$(function(){
    $('.editedpart .edit').click(function(){
        var parent = $(this).closest(".editedpart");

        var action = $(this).attr('title');
        var str = parent.attr('title');
        var page = parent.find('.t_div').val();

        $('#pcontent').load('../views/edit.php', {
            page: page,
            action: action,
            editedpart: str
        })
    })

})
于 2013-04-30T02:48:54.077 回答