在文本框中添加卢比符号答案

【问题标题】：Add Rupee symbol in the text box在文本框中添加卢比符号
【发布时间】：2013-09-07 13:17:23
【问题描述】：

如何在文本框字段中添加印度卢比符号而不使用卢比。

金额：<input name="amount" type="text" size="20" value="Rs. 1.00">

在此我需要显示“卢比”。就符号而言，就像我们如何使用“$”一样。

【问题讨论】：

检查这些链接wikihow.com/Install-and-Use-Indian-Rupee-Symbol-in-Windows labnol.org/india/windows-fonts-for-rupee/18964
你不能通过复制粘贴来使用符号 ₹ 吗？
我试过了，但它显示给我一个方形框...包括字体也..但符号没有出现。
似乎是类似的问题stackoverflow.com/questions/3598085/…
@shemy 谢谢，但我已经浏览了那个链接..但我希望它在“文本框”内......并且“文本框”内的文本是硬编码的..

标签： html unicode symbols

【解决方案1】：

根据我的说法，您不应该这样做，无论您是将值保存在数据库中，还是用于计算某些东西或其他任何东西，只需存储整数，然后连接 Rs. 或卢比符号与整数。这样就不会在计算或存储值时给您带来麻烦。

就卢比符号而言，您可以使用&#x20B9;

Demo

Demo 2（推荐）

更好的解决方案

我从零开始做了一个使用background-image的demo，这样，你的text字段将指示该值是卢比，而且它会跨浏览器。

Demo

Demo 2（使用background-size 使图像变小）

input[type=text].rupee {
    background-image: url(http://i.imgur.com/Fd7NROx.png);
    border: 1px solid #aaa;
    padding: 5px;
    padding-left: 20px; /* Indent the text values inside textbox */
    background-size: 20px 25px; /* Change symbol size */
    background-repeat: no-repeat; /* So that rupee image doesn't repeat */
}

【讨论】：

【解决方案2】：

使用#8360；

<input name="amount" type="text" size="20" value="&#8360; 1.00">

【讨论】：

我不想将其显示为文本，即“Rs”。我想把它显示为一个符号
您好，您的帖子已被标记为“低质量”，可能是因为它仅包含代码。您可以通过解释这究竟是如何以及为什么回答问题来大大改进您的答案？

【解决方案3】：

只需包含以下 javascript，它就会为您将所有“Rs”更新为“Rupee Symbol” <script src="http://webrupee.anmoul.com/js" type="text/javascript"></script>

或只需使用卢比符号 Unicode 字符代码 ₹

【讨论】：

【解决方案4】：

试试这个sn-p

css

 .customTextfield input{
 border:unset;
  
}
.customTextfield input:focus{
  outline:unset;
}
.customTextfield{
  border:1px solid #000;
  padding:2px;
}

<span class="customTextfield">
  &#x20B9; <input name="amount" type="text">
</span>

【讨论】：