html 如何将注解选项添加到注解框中，以便注解显示在注解框下方？

wtzytmuj 于 2022-11-20 发布在其他

关注(0)|答案(2)|浏览(145)

如何将注解选项添加到注解框中，以便注解显示在注解框下方？
我已经准备好了评论框，但只有这份附录不见了。
我的html...

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Comment Box</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
   
    <input type="text" id="my-text" placeholder="Enter comment">
    <p id="result"></p>
    <button id="post">Post</button>
    <ul id="unordered">
       
   </ul>
   
    <script src="code.js"></script>
</body>
</html>

我的...

var myText = document.getElementById("my-text");
var result = document.getElementById("result");
var limit = 140;
result.textContent = 0 + "/" + limit;

myText.addEventListener("input",function(){
    var textLength = myText.value.length;
    result.textContent = textLength + "/" + limit;

    if(textLength > limit){
        myText.style.borderColor = "#ff2851";
        result.style.color = "#ff2851";
    }
    else{
        myText.style.borderColor = "#b2b2b2";
        result.style.color = "#737373";
    }

});

我试着根据这个代码来解决它-https://linuxhint.com/create-comment-box-using-html-css-javascript/-但是我找不到一个解决方案，我不明白它是怎么做到的。有什么想法吗？

Html

来源：https://stackoverflow.com/questions/74460835/how-can-i-add-a-comment-option-to-my-comment-box-so-that-the-comments-appear-bel

2条答案

按热度按时间

3bygqnnd1#

我认为您必须使用和appendChild将li添加到ul的列表中
你要做的事情，你可以在其他网站上找到更多的帮助或信息，以“个人Twitter”或“待办事项列表”命名。它的其余代码看起来很好，但你只需要添加这个appendChild，在html中写入数据：）
您也可以使用this video，并使用它来指涉。

赞(0）回复(0）举报 2022-11-20

5us2dqdw2#

我终于找到了一个方法来让这个功能工作。但有这个问题，我需要能够提交几个评论下对方..现在当添加一个新的评论，它只是覆盖旧的。任何想法我应该添加什么？
HTML语言

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Character Limit</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <input id="userName" type="text" name="full name" placeholder="Full Name">
        <br>
        <input id="userEmail" type="text" name="email" placeholder="Email Address...">
        <br>
        <textarea type="text" id="userComment" rows="5" placeholder="Type Your Comment.."></textarea>
        <h1 id="result"></h1>
        <br>
        

        <button type="submit" onclick="myFunction()" value="Submit"> Submit Comment</button>

        <ul id="unordered"></ul>

    </div>
   
    <p id="data"></p>

    <script src="script.js"></script>
    
    
</body>
</html>

JS系统

var userComment = document.getElementById("userComment");
var result = document.getElementById("result");
var limit = 140;
result.textContent = 0 + "/" + limit;

userComment.addEventListener("input",function(){
    var textLength = userComment.value.length;
    result.textContent = textLength + "/" + limit;

    if(textLength > limit){
        userComment.style.borderColor = "#ff2851";
        result.style.color = "#ff2851";
    }
    else{
        userComment.style.borderColor = "#b2b2b2";
        result.style.color = "#737373";
    }

});

function myFunction(){
    let data = "";  let name = document.getElementById("userName").value
    let email = document.getElementById("userEmail").value
    let comment = document.getElementById("userComment").value
   
   data = "User name : "+name+"<br/>User email : "+email+ "<br/>User comment : "+comment
   
   document.getElementById("data").innerHTML = data  // display data to paragraph
   }

赞(0）回复(0）举报 2022-11-20

我来回答

html 如何将注解选项添加到注解框中，以便注解显示在注解框下方？

2条答案

相关问题

热门标签

最新问答