單擊按鈕時,它會自動滾動到頁面底部。我在代碼中看不到它為什么這樣做的原因。有什么我想念的嗎?
代碼:
for ($x=0; $x<$numresults; $x ) { //display the results
$sam=$info[$x]['samaccountname'][0];
$disp=$info[$x]['displayname'][0];
$dir=$info[$x]['homedirectory'][0];
$displayout=substr($sam, 0, 4);
echo "User Name : $sam";
echo "<br>Name : $disp";
echo "<br>Home Drive : <a class=clear href=$dir>$dir</a><br>";?>
<p id="demo<?php echo $x; ?>"style="position:absolute;left:-1000px;top:-1000px;">
<?php echo $dir ?>
</p>
<button onclick="copy('demo<?php echo $x; ?>')">Copy Home Drive</button> <br><br>
<?php }
echo "</div>";
}
else echo "</div><div><br><a class=clear href=javascript:history.go(-1)>Search again</a></div>";
ldap_close($cnx);
?>
<script>
function copy(element_id) {
var aux = document.createElement("div");
aux.setAttribute("contentEditable", true);
aux.innerHTML = document.getElementById(element_id).innerHTML;
aux.setAttribute("onfocus", "document.execCommand('selectAll',false,null)");
document.body.appendChild(aux);
aux.focus();
document.execCommand("copy");
document.body.removeChild(aux);
}
</script>
謝謝
uj5u.com熱心網友回復:
只需使用它:
navigator.clipboard.writeText(text)
滾動最有可能發生,因為您在附加到頁面底部的新元素上選擇文本。
uj5u.com熱心網友回復:
免責宣告:此代碼段將顯示一條錯誤訊息,但代碼在自己的服務器上托管時可以正常作業!
使用相當新的剪貼板 API可以完成更簡潔的資料復制方法 imo - 消除了在螢屏外添加元素、附加新元素和洗掉它們的需要。這也應該可以防止提到的滾動,因為這是focus在您最近添加的div元素上無意中使用的副產品。
由于您的原始代碼使用多個br標簽來分隔顯示的專案,因此(從樣式和 DOM 操作/詢問的角度來看)為每組結果使用一個公共父元素會更容易。您可以按如下方式重寫回圈邏輯:
foreach( $info as $arr ){
$obj=(object)$arr;
printf(
'<div class="usr">
<div>Username: %1$s</div>
<div>Name: %2$s</div>
<div>Homedrive: <a href="%3$s">%3$s</a></div>
<button>Copy Home Drive</button>
</div>',
$obj->samaccountname[0],
$obj->displayname[0],
$obj->homedirectory[0]
);
}
然后呈現的內容可能如下所示,例如:
document.querySelectorAll('div.usr button').forEach(bttn=>bttn.addEventListener('click',function(e){
navigator.clipboard.writeText( this.parentNode.textContent )
.then(()=>{
alert( 'Copied' )
})
.catch( err=>alert( err ) )
}))
<div class="usr">
<div>Username: Big_G</div>
<div>Name: Geronimo</div>
<div>Homedrive: /nas-vol1/geonimo</div>
<button>Copy Home Drive</button>
</div>
<div class="usr">
<div>Username: Poca</div>
<div>Name: Pocahontas</div>
<div>Homedrive: /nas-vol2/pocahontas</div>
<button>Copy Home Drive</button>
</div>
<div class="usr">
<div>Username: Chief_SB</div>
<div>Name: SittingBull</div>
<div>Homedrive: /nas-vol1/SittingBull</div>
<button>Copy Home Drive</button>
</div>
<div class="usr">
<div>Username: Tonto</div>
<div>Name: TomTom</div>
<div>Homedrive: /nas-vol2/TomTom</div>
<button>Copy Home Drive</button>
</div>
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/355149.html
標籤:javascript php html
