更新

Question

我需要在标签后隐藏文字。

我的html字段是，

 <div id="layered_ajax_loader" style="display: none;">
            <p>
                <img src="./img/loader.gif" alt="" />
                <br />Loading...
            </p>
        </div>



    <form name="chk_disp_page_cnt"  method="get"  onsubmit="return pagn_cal()">
    <input type="hidden" id="hids" value="id_category" />
            <input type="text" id="tst" onfocus="disp_hide_image()"   style="width:50px; height:23px;" />
    </form>

Javascript functions are,


function disp_hide_image()
{

   $('#layered_ajax_loader').show();
   $('layered_ajax_loader').hide();
   $('img[src=".loader.gif"]').hide();
   $("div p:contains('Loading...')").parent('div').hide();
}

当文本框为空时，我需要隐藏文本Loading ...我怎样才能做到这一点。

Answer 1

检查一下 -

<div id="layered_ajax_loader" style="display: none;">
    <p>
        <img src="./img/loader.gif" alt="" />
        <br />Loading...
    </p>
</div>

<form name="chk_disp_page_cnt"  method="get"  onsubmit="return pagn_cal()">
    <input type="hidden" id="hids" value="id_category" />
    <input type="text" id="tst" onfocus="disp_hide_image()"   style="width:50px; height:23px;" />
</form>

function disp_hide_image()
{
    if ('' === $('#tst').val()) {
        $('#layered_ajax_loader').hide();
    } else {
        $('#layered_ajax_loader').show();
    }
}

注意：我猜你需要显示/隐藏父div。加载程序图像将自动显示/隐藏。

更新

我尝试使用以下代码，它对我来说很好。

<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<div id="layered_ajax_loader" style="display: none;">
    <p>
        <img src="./img/loader.gif" alt="" />
        <br />Loading...
    </p>
</div>

<form name="chk_disp_page_cnt"  method="get"  onsubmit="return pagn_cal()">
    <input type="hidden" id="hids" value="id_category" />
    <input type="text" id="tst" onkeyup="disp_hide_image()"  style="width:50px; height:23px;" />
</form>

<script>
function disp_hide_image()
{
    if ('' === $('#tst').val()) {
        $('#layered_ajax_loader').hide();
    } else {
        $('#layered_ajax_loader').show();
    }
}
</script>

注意：我尝试使用onkeyup进行更好的测试。

Answer 2

                <body onload="onLoad()" >
            <div id="layered_ajax_loader" style="display: none;">
                        <p>

                            <br />Loading...
                        </p>
                    </div>



                <form name="chk_disp_page_cnt"  method="get"  id="myid" onsubmit="return pagn_cal()">
                <input type="hidden" id="hids" value="" />
                        <input type="text" id="tst" onfocus="disp_hide_image()"   style="width:50px; height:23px;" />
                </form>
            </body>

            <script>
                var me="";

                function onLoad()
                {
                    console.log("a");
                    me=document.getElementById('hids').value
                    console.log(me);
                    if(me=="")
                    {
                        var body = document.body;
                        document.getElementById('tst').style.display = "none";
                        //body.removeChild(document.getElementById('myid'));
                    }
                }

                function disp_hide_image()
                {

                }
            </script>

使用纯JavaScript可以隐藏元素，也可以从DOM中删除元素。

我认为这份文件很好： http://www.w3schools.com/jsref/prop_style_display.asp

还有一些其他的堆栈溢出我立即看到描述这两种技术。同样，代码可以移动到disp_hide_image（）中，因为我认为您正在请求评论。

Answer 3

javascript代码

$(document).ready(function(e) {
$("#tst").on("keyup",function ()
{
    if ($(this).val() == "")
    {
        $("#layered_ajax_loader").hide();
    }
    else
    {
        $("#layered_ajax_loader").show();
    }
})
});

您必须删除此

<强>的onfocus =＆＃34; disp_hide_image（）＆＃34;

如何使用Javascript隐藏文本框焦点上的文本

3 个答案:

更新