试图找到并设置高度加载svg。
$('#case_1_btn').one('click', function(){
$('#image_placeholder').load('cases/case_1/images/case_1_1.svg');
var svg = $('#image_placeholder').find('svg')[0];
alert(svg);
svg.setAttribute('height', '50%')
});
警报状态为“未定义”。所以这个问题需要解决。
然后在console中设置svg的高度会返回一个错误:
Case Studies - Racism and Bias.html:56 Uncaught TypeError: Cannot read properties of undefined (reading 'setAttribute')
at HTMLDivElement.<anonymous> (Case Studies - Racism and Bias.html:56:8)
at HTMLDivElement.i (jquery-3.7.1.min.js:2:37034)
at HTMLDivElement.dispatch (jquery-3.7.1.min.js:2:40035)
at v.handle (jquery-3.7.1.min.js:2:38006)
svg本身在svg代码中没有设置高度和宽度。只有Viewbox。
HTML
<body>
<div id="container">
<div id="main_title_container">
<div id="main_title_txt">UWA Optometry - Case Studies - Racism and Bias</div>
</div>
<div id="side_menu">
<div id="case_btn_container">
<div class="case_btn" id="case_1_btn">
<div class="case_btn_txt">Case 1</div>
</div>
<div class="case_btn" id="case_2_btn">
<div class="case_btn_txt">Case 2</div>
</div>
<div class="case_btn" id="case_3_btn">
<div class="case_btn_txt">Case 3</div>
</div>
<div class="case_btn" id="case_4_btn">
<div class="case_btn_txt">Case 4</div>
</div>
<div class="case_btn" id="case_5_btn">
<div class="case_btn_txt">Case 5</div>
</div>
</div>
</div>
<div id="content">
<div id="image_placeholder"></div>
<div id="case_text_container"></div>
<div id="start_btn"></div>
</div>
</div>
</body>
还尝试:
var svg = $("#image_placeholder")[0].contentDocument.documentElement;
1条答案
按热度按时间erhoui1w1#
你需要等待hte图像加载,然后才能用jquery选择它。查询图像的代码不会等到图像被加载,它会立即触发(当div仍然为空时)
这应该可以解决您的问题。