初始化后更改输入字段的占位符文本

Posted 2023-03-05

【中文标题】初始化后更改输入字段的占位符文本

【英文标题】：Change the placeholder text of an input field after initializing

【发布时间】：2015-04-17 13:33:03

【问题描述】：

我正在使用在地图上生成的输入字段。我想将输入字段的占位符文本从“搜索”更改为“搜索位置”。

输入字段没有类或 id，但其父项有。我尝试在下面使用 jQuery 初始化后进行更改，但无济于事。

$('.leaflet-control-mapbox-geocoder-form input').attr("placeholder","Search for Location");

下面是可见输入字段的小提琴。我很高兴继续使用 jQuery 或通过纯 JS。

http://jsfiddle.net/teraw600/

【问题讨论】：

我可以知道你把代码放在哪里吗？我已经修改了您的代码http://jsfiddle.net/teraw600/1/ 进行测试，它可以工作。

【参考方案1】：

更好的方法是将键值对（占位符：您的文本）添加到地理编码器对象，如下所示：

  var geocoder = new MapboxGeocoder(
    accessToken: mapboxgl.accessToken,
    mapboxgl: mapboxgl,
    placeholder: 'Search for Location'
  );

【参考方案2】：

它在您的示例中不起作用，因为未包含 jQuery。

如果您不想使用 jQuery，可以使用以下代码：

Updated Example

document.querySelector('.leaflet-control-mapbox-geocoder-form input').placeholder = "Search for Location";

---

您还可以为ready 事件添加事件侦听器，然后在回调中更改placeholder 属性。同样，不需要 jQuery：

Example Here

L.mapbox.accessToken = 'pk.eyJ1Ijoic3BheWNlIiwiYSI6IlNIMnRfZ2MifQ.SreIfdJljzEj2M033UubsA';
L.mapbox.map('map', 'examples.h186knp8')
    .addControl(L.mapbox.geocoderControl(
        'mapbox.places', 
            keepOpen: true
        
    ))
    .addEventListener('ready', function () 
        document.querySelector('.leaflet-control-mapbox-geocoder-form input').placeholder = "Search for Location";
    
);