如何通过JavaScript在HTML输入框中插入度数符号

Question

我有一个文本框，其HTML代码为：

HTML

<input type="text" id="lat" placeholder="Latitude" ng-lat value="9&#176;"> 

这段代码在正常情况下可以完美地显示度数符号，但是当我尝试通过jQuery设置值时却出现问题，如下：

Jquery

$("#lat").val("9°")

它将整个文本都显示出来，而不是度数符号。

- BiJ

---

建议将单位放在输入框之外，否则你需要费力确保单位出现在输入的值中并且位置正确。将其放在外面，在发送给服务器之前根据需要添加即可。 - Rory McCrossan

@RoryMcCrossan - 这应该是一个答案。 - SK.

我已经考虑过了，但我需要在一个文本框中显示纬度的详细信息（度、分、秒），并且要求在那里添加度数符号。 - BiJ

如果是这种情况，我会考虑输入掩码。 - Rory McCrossan

Answer 1

您可以针对value属性进行定位：

$("#lat").attr('value',"101"+String.fromCharCode(176))

最好使用.text()来设置文本，因为.val()用于检索元素的值。

- Pindo

Answer 2

您可以使用HEXCode，例如：

 <a href id="my">Here</a> 
<script>
    $('#my').click(function()
                    {
    alert('9\xB0');
    });
    </script>

请查看此链接了解更多信息。

- Parag Jadhav

---

请注意，9不是代码的一部分！ ° 符号只是 '\xB0'。 - The Godfather

@TheGodfather 我只是举了9作为一个例子。 - Parag Jadhav

Answer 3

$("#test").click(function(){ 
    $("#lat").val("29" + ascii(176))
});

function ascii (a) { return String.fromCharCode(a); }

为了提供更多帮助，已更新JSFiddle：http://jsfiddle.net/zkh2of12/1/

- Ayush

Answer 4

直接在JavaScript中设置符号，而不是在HTML代码中设置，这样怎么样？

$(function(){
  $("#set").click(function(){
    $("#lat").val("°");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" id="lat" placeholder="Latitude" ng-lat value="9&#176;"> 

<button id="set">set</button>

如果您想改善它们，只需创建一个隐藏的 <span>，其中包含所需的 HTML 代码，然后使用 JavaScript 选择该 HTML。即使是您无法在 JS 中发布的符号也可以这样做。

- smnbbrv

Answer 5

在输入框旁使用特殊标签，这将对用户更加清晰明了：

<input type="text" id="lat" placeholder="Latitude &#176;" value=""> &#176;

- Eduardo Yáñez Parareda

Answer 6

试试这个：

$("#lat").attr("val","9"+ascii(176));

- Muhammad Atif

---

"ascii" 未定义。 - Hacketo