标签: html-input

我想使用 jquery 切换功能切换按钮的值，但它不起作用

我的按钮如下：

<input type="button" value="Click to send message"  id="send_message_button">

现在我想用 jquery 将“单击发送消息”切​​换为“单击隐藏消息”，这可能吗？

我正在创建一个引用图像的 ImageButton，其中包含多个图标。我试图通过定位背景图像来显示正确的图标，但这不起作用。这是我创建的方式ImageButton：

ImageButton closeButton = new ImageButton();
closeButton.CommandName = "CloseItem";
closeButton.ID = "BtnClose";
closeButton.Width = 16;
closeButton.Height = 16;
closeButton.ImageUrl = "/_layouts/15/1031/images/formatmap16x16.png?rev=23.gif";
closeButton.Style.Add(HtmlTextWriterStyle.Top, "-115");
closeButton.Style.Add(HtmlTextWriterStyle.Left, "-275");
closeButton.OnClientClick = btn.OnClientClick;
this.Controls.Add(closeButton);

这导致以下 HTML：

<input type="image" 
       name="ctl00$ctl40$g_8cd9fd5c_6191_46af_bf6a_ac27c5fb0e80$ctl00$toolBarTbl$RightRptControls$ctl02$BtnClose" 
       id="ctl00_ctl40_g_8cd9fd5c_6191_46af_bf6a_ac27c5fb0e80_ctl00_toolBarTbl_RightRptControls_ctl02_BtnClose" 
       src="/_layouts/15/1031/images/formatmap16x16.png?rev=23.gif" 
       onclick="STSNavigate('http:\u002f\u002fespseis13\u002fsharechange\u002fdefault.aspx');return false;WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$ctl40$g_8cd9fd5c_6191_46af_bf6a_ac27c5fb0e80$ctl00$toolBarTbl$RightRptControls$ctl02$BtnClose&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" 
       style="height:16px;width:16px;top: -115px;left: -275px">

我显示的图像是这样的：

我不能轻易切换输入类型，因为它需要属性CommandName = "CloseItem"。 有谁知道，我如何移动（而不是缩放！）由input类型引用的图像image？

我正在使用typeahead.js从themoviedb api获取电影信息.当用户输入电影的标题时,我需要获得电影的年份和要自动添加到其他输入的电影的ID.

因此,当用户使用输入电影标题并点击建议的标题时,它会自动将年份和电影ID添加到其他输入

HTML代码

<input class="typeahead" placeholder="Movie Title Here"><br>
<input class="year" placeholder="Year Here">
<input class="id" placeholder="Year ID">

JS代码

看看接近返回(在第12行),我需要将信息传输到其他输入

var movies = new Bloodhound({
    datumTokenizer: function (datum) {
        return Bloodhound.tokenizers.whitespace(datum.value);
    },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    limit: 10,
    remote: {
        url: 'http://api.themoviedb.org/3/search/movie?api_key=470fd2ec8853e25d2f8d86f685d2270e&query=%QUERY&search_type=ngram',
        filter: function (movies) {
            // Map the remote source JSON array to a JavaScript array
            return $.map(movies.results, function (movie) {
                    return {
                        id: movie.id,
                        value: movie.original_title,
                        year: (movie.release_date.substr(0,4) ? movie.release_date.substr(0,4) : '')
                    };
                });
            }
        }
    });

// Initialize the Bloodhound …

我已经创建了类型=“RANGE”和 id=“slider”的 HTML INPUT 元素。为什么我不能使用 getAttribute("value") 方法访问它的值？调试器显示有一个名为“value”的属性，其值不等于元素的值。range 元素的值不应该是它的属性吗？

var sliderValue1=document.getElementById("slider").getAttribute("value");
var sliderValue2= document.getElementById("slider").value;

因此，我的网络表单上有一个文本字段，用户将用它来输入文件路径。我想检查输入的内容是否以 .pdf 结尾

我一直在四处寻找，看起来我需要使用 RegEx 来获得多个浏览器支持，但我找不到一个很好的例子。

HTML 字段

<input type="text" name="filelocation" id="filelocation" placeholder="Must include .pdf file extension">

我绑定了两个单独的事件进行测试，但无论出于何种原因，当我选择文件时，它们都没有触发。我确信我今天没有喝足够的咖啡，但这似乎是检测文件选择的正确方法。

HTML：

<input type="file" id="files">

JS：

$(document).on("ready", function() {

    $("#files").on("change", function() {
        alert("Files changed.");
    });

    $(document).on("change", "#files", function() {
        alert("Files changed.");
    });

});

示例： https: //jsfiddle.net/snoapps/66y45hjh/

我如何验证这样的模式......

(562) 810-5566 或 (714) 433-4434

请注意，它将包含括号和空格。

我当前的输入控件如下所示：

<input type="tel" data-tel-msg="Invalid Phone Number!" class="k-textbox" pattern="^\d{3}-\d{3}-\d{4}$" required />

我知道当前模式匹配 3334445555，但这不是我正在寻找的，当我尝试添加括号时，JavaScript 控制台只是给出了错误正则表达式语法错误。

另外，如果您知道如何让它显示自定义错误消息，这也会有所帮助。目前我的 data-tel-msg 无法正常工作。

我想以<select>某种方式使用一个字段作为 Bootstrap3 的输入组插件

 -------------------------------------
|   select v   |   input text field   |
 -------------------------------------

所以，我认为实现这一目标使用.input-group，.input-group-addon以及.form-control类。

<div class="input-group">
    <select class="input-group-addon" id="protocol">
        <option>http://</option>
        <option>https://</option>
    </select>
    <input type="text" class="form-control" id="domain" aria-describedby="protocol">
</div>

（参见 bootply 示例）

但是该.input-group-addon课程似乎不适用于<select>物品。它看起来像这样：

我该如何修复以正确对齐它？

如何在不设置为隐藏控件的情况下隐藏 html 输入字段中的文本或值。我想让文本框保持可见，但文本/值是隐藏的。有可能吗？

谢谢你

有没有办法在 IE 中设置 HTML input type="range" 的高度？我的意思是块高度，而不是轨道高度。这是我所拥有的：

input[type=range]::-ms-track {
    width: 100%;
    height: 6px;
}

使用上面的代码，我得到了一个 6px 高度的轨道，但元素块仍然高得多，如下图所示，我在其中放置了虚线边框以查看块： IE_Input_Range_Track_Height