div模拟多行输入框,获取内容

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div id='inputDiv' style="width: 300px;height:300px;margin:0 auto;border:1px solid #30f;" contenteditable="true">

    </div>
    <button id='btn'>点击获取</button>
</body>
<script>
    var oDiv = document.getElementById('inputDiv')
    document.getElementById('btn').onclick = function(){
        console.log(oDiv.innerHTML)
    }
</script>
</html>

给div标签一个属性contenteditable="true",当前div就可以像textarea输入信息。获取的方式是直接获取div内容。代码运行可以试一下结果

猜你喜欢

转载自www.cnblogs.com/bigDipper/p/9171562.html