暮影重生 2018-12-15 03:53 采纳率: 100%
浏览 2199
已采纳

怎么用JS修改当前元素里的子元素的内容

首先,上代码

html部分
<div class="row">
    <div class="col-md-10">
        <div class="form-group">
            <label class="name">姓名:</label>
            <input type="text" name="name" class="form-control" required="required" onchange="showstate(this.value)">
        </div>
    </div>
    <div class="col-md-2">
        <label></label>
        <div id="showstate"></div>
     </div>
</div>
<div class="row">
    <div class="col-md-10">
        <div class="form-group">
            <label class="title">标题:</label>
            <input type="text" name="title" class="form-control" required="required" onchange="showstate(this.value)">
        </div>
    </div>
    <div class="col-md-2">
        <label></label>
        <div id="showstate"></div>
     </div>
</div>

分割一下,JS部分

function showstate(str) {
        if (str.length == 0){
            document.getElementById("showstate").innerHTML = "";
            return;
        }
        if (window.XMLHttpRequest){
            //IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
            //IE5, IE6
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function () {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
                document.getElementById("showstate").innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET","checkinfo.php?i="+str, true);
        xmlhttp.send();
    }

然后我希望的是,在姓名或者标题下输入完成的时候,在对应的showstate里面能显示对应的提示 (我在checkinfo.php里面写好了查询)

我的JavaScript该怎么改才行呢

  • 写回答

1条回答 默认 最新

  • 天际的海浪 2018-12-15 07:26
    关注

    在函数里加个参数。把要对应元素的id传过去啊

    <div class="row">
        <div class="col-md-10">
            <div class="form-group">
                <label class="name">姓名:</label>
                <input type="text" name="name" class="form-control" required="required" onchange="showstate(this.value,'showstate1')">
            </div>
        </div>
        <div class="col-md-2">
            <label></label>
            <div id="showstate1"></div>
         </div>
    </div>
    <div class="row">
        <div class="col-md-10">
            <div class="form-group">
                <label class="title">标题:</label>
                <input type="text" name="title" class="form-control" required="required" onchange="showstate(this.value,'showstate2')">
            </div>
        </div>
        <div class="col-md-2">
            <label></label>
            <div id="showstate2"></div>
         </div>
    </div>
    分割一下,JS部分
    
    function showstate(str,id) {
            if (str.length == 0){
                document.getElementById(id).innerHTML = "";
                return;
            }
            if (window.XMLHttpRequest){
                //IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            } else {
                //IE5, IE6
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = function () {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
                    document.getElementById(id).innerHTML = xmlhttp.responseText;
                }
            }
            xmlhttp.open("GET","checkinfo.php?i="+str, true);
            xmlhttp.send();
        }
    
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥30 用arduino开发esp32控制ps2手柄一直报错
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 求chat4.0解答一道线性规划题,用lingo编程运行,第一问要求写出数学模型和lingo语言编程模型,第二问第三问解答就行,我的ddl要到了谁来求了
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题
  • ¥15 Visual Studio问题