HTML中的元素ID [英] element ID's in HTML

问题描述

我有一个html菜单，点击不同的项目会触发一些javascript代码取消隐藏相应的'div'。

I have a menu in html, clicking on the different items will trigger some javascript code to unhide the respective 'div'.

<section>
<ul class="link-list" id="menu">
  <li><a href="addProduct" rel="addProduct">Add New Product</a></li>
  <li><a href="modifyProduct" rel="modifyProduct">Modify Products</a></li>
  <li><a href="removeProduct" rel="removeProduct">Remove Product</a></li>
</ul>
</section>

JavaScript：

JavaScript:

$(document).ready(function(){
      $('#menu a').click(function(){
        $('.content').hide();
        handleNewSelection.apply($("#menu"));
        $('#'+this.rel+'').show();
      return false;
      });
      $('.content input.close').click(function(){
        $(this).parent().hide();
      });
    });

    hideAllDivs = function () {
      $("#addProduct").hide();
      $("#modifyProduct").hide();
      $("#removeProduct").hide();
    };

    handleNewSelection = function () {
      hideAllDivs();
    };

    $(document).ready(function() {
      handleNewSelection.apply($("#menu"));
    });

function getDetails(){
    var productCode = document.getElementById('productCode').value;

  $.ajax({ type: "POST",
      url: './produceProductImage.php',
      data: 'productCode='+productCode,
      success : function(data) {
        $("#productImageName").html(data);
    }
    });

  var geturl = "_getXML.php?productCode="+productCode ;

  downloadUrl(geturl, function(data) {
    var xml = data.responseXML;
    var markers = xml.documentElement.getElementsByTagName("marker");
    for (var i = 0; i < markers.length; i++) {
      var productName = markers[i].getAttribute("productName");
    var productDescription = markers[i].getAttribute("productDescription");
    var productPrice = markers[i].getAttribute("productPrice");
      var category = markers[i].getAttribute("category");
    var active = markers[i].getAttribute("active");
    var featured = markers[i].getAttribute("featured");

    document.getElementById("productName").value=productName;
    document.getElementById("productDescription").value=productDescription;
    document.getElementById("productPrice").value=productPrice;
    document.getElementById("category").value=category;
    if (active === "1") {
      document.getElementById("active").value='Yes';
      } else { document.getElementById("active").value='No'; }
    if (featured === "1") {
      document.getElementById("featured").value='Yes';
      } else { document.getElementById("featured").value='No'; }
    }
  });
}

  function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
        new ActiveXObject('Microsoft.XMLHTTP') :
        new XMLHttpRequest;

      request.onreadystatechange = function() {
      if (request.readyState == 4) {
        request.onreadystatechange = doNothing;
        callback(request, request.status);
      }
      };

      request.open('GET', url, true);
      request.send(null);
    }

    function doNothing() {}

我的问题是对于RemoveProduct和ModifyProduct我使用相同的文本框ID名称，并在通过其id引用文本框时，我没有得到正确的结果。有没有办法在仍然使用相同的javascript函数getDetails（）时如何才能完成这项工作。

My Problem is that for RemoveProduct and ModifyProduct I am using same textbox id's names and when referring to a textbox by its id I am not getting the proper results. Is there a way how can I make this work while still using the same javascript funtion getDetails().

推荐答案

（document）.ready（function（）{

(document).ready(function(){

（' ＃menu a'）。click（function（） {

('#menu a').click(function(){

（' .content'）。hide（） ;
handleNewSelection.apply（

('.content').hide(); handleNewSelection.apply(

这篇关于HTML中的元素ID的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！