將屬性表顯示爲x3dom對象的彈出框

我是該字段的新手，並且一直在嘗試使用x3dom對象。我現在面臨的問題是如何以彈出窗口的形式顯示x3dom對象的屬性。我已經看到了x3dom網站上給出的例子，但還沒有找到任何相關的例子。如果有人舉例分享，我會很高興。先謝謝你。將屬性表顯示爲x3dom對象的彈出框

來源

2012-12-17 user1879084

您可以使用attributes屬性（如document.getElementById("id").attributes），這裏的顯示屬性的表爲例，當您單擊按鈕：

<!DOCTYPE html> 
<html lang="en"> 
<head> 

    <meta charset="utf-8"> 
    <title>X3DOM</title> 
    <link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.0.4/css/bootstrap.min.css" rel="stylesheet" /> 

</head> 
<body class="container"> 


    <X3D width="100%" height="300px"> 
     <Scene> 
      <Shape id="myShape"> 
       <Appearance> 
        <Material id="myMaterial" diffuseColor="0.6 0.6 0.6" specularColor="0.8 0.8 0.8" shininess="0.145" ambientIntensity="0.2" emissiveColor="0,0,0"/> 
       </Appearance> 
       <Sphere /> 
      </Shape> 
     </Scene> 
    </X3D> 


    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
    <script src="http://x3dom.org/x3dom/release/x3dom.js"></script> 
    <script> 
    function displayAttributes(objectId){ 
     var code = ''; 
     var attributes = document.getElementById(objectId).attributes; 
     $.each(attributes, function(index, attr) { 
      code += '<tr><th>' + attr.name +'</th><td>' + attr.value + '</td></tr>'; 
     }); 
     $("#attributesTable").html(code); 
    } 
    </script> 


    <button onclick="displayAttributes('myShape')" class="btn btn-large">Attributes of the shape</button> 
    <button onclick="displayAttributes('myMaterial')" class="btn btn-large">Attributes of the material</button> 

    <table id="attributesTable" class="table table-striped table-bordered" style="margin-top:50px"></table> 


</body> 
</html>

要點：https://gist.github.com/4329304

來源

2012-12-18 16:14:10 wildpeaks

非常感謝你的回覆。它爲我澄清了一些要點。然而，我正在尋找的是點擊對象，並獲得它的屬性信息彈出而不是按鈕。再一次感謝你.. – user1879084

正是你正在嘗試爲不清楚這是否有幫助

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<link rel="stylesheet" type="text/css" href="http://x3dom.org/x3dom/example/x3dom.css"></link> 
<script type="text/javascript" src = "http://x3dom.org/x3dom/example/x3dom.js"></script> 
</head> 
<body> 
<X3D showLog='true' width="400px" height="400px"><Scene> 
<Shape><Box size="2 2 2" onclick="alert_attributes();" /></Shape> 
</Scene></X3D> 
<script> 
function alert_attributes() 
{ 
var size = document.getElementsByTagName("Box")[0].getAttribute('size'); 
x3dom.debug.logInfo(size); 
alert(size); 

} 
</script> 
</body> 
</html>

來源

2012-12-23 09:53:05 drfrog

將屬性表顯示爲x3dom對象的彈出框

回答

相關問題