Javascript 基于data.name显示div

第三次是一种魅力

这就是我想要实现的

我想使用

data.name

来填充divs ID名称。我希望单击时显示

，下面是我尝试过的内容

  click: function(event, data) {
    $('#clicked-state')
        // .text('You clicked: '+data.name);
        .show($("<div id='" + data.name + "'/>" ));
        // .parent().effect('highlight', {color: '#C7F464'}, 2000);
  }
});

js

html

这是弗吉尼亚。

我正在使用此插件生成州数据。名称和地图。

---

由于

HTML

页面中的id是唯一的，您可以直接使用选择器以div为目标并显示它

$('#' + data.name).show();

code

click: function(event, data) {
        $('#' + data.name).show();
  }

---

问题是。show不接受任何参数。我不是100%确定你想做什么。如果您试图用状态名显示一个现有的div，您应该像这样调用它

$("#" + data.name).show();

如果要创建新的div，请在包含div的父级上使用.html（如果不存在div，请在其中创建一个）

$（“#ParentDiv”）.html（“”）；

某段代码（）：

国家1
国家2
国家3
国家1
国家2
国家3
$（“选择”）。在（“更改”，函数（）上{
var v=$（this.val（）；
$（“div”）.hide（）；
$（“div#“+v）.show（）；
});
div{
显示：无；
}

好的，前面的回答误解了这个问题，所以这里是我的第二次尝试：

//记住要包括您的us-map.js库
$（'.state'）.hide（）；
$（'#map'）.usmap({
//单击操作
单击：功能（事件、数据）{
console.log（data.name）；
$（“.state”）.hide（）；
$（'#'+data.name）.show（）；
}
});

这是弗吉尼亚
这里是加利福尼亚

您能显示更多代码吗？也许是html标记？无法理解单击状态是什么。你在使用jQuery吗？看看这个教程，看看它是否有用：嘿！我已经更新了问题！准确地说，

。show

可以获取参数，但当然不喜欢问题中的东西是的，对不起

.show

接受参数，但不是询问者希望传递参数的方式。我认为您的代码中有输入错误，它可能仍然有效，但可能您删除了某些内容或忘记删除了某些本应有效的内容。尝试在div

id

中使用大写字母

$('#' + data.name).show();

click: function(event, data) {
        $('#' + data.name).show();
  }

$("#" + data.name).show();

$("#ParentDiv").html("<div id='" + data.name + "'/>");

<select>
    <option value="state1">State 1</option>
    <option value="state2">State 2</option>
    <option value="state3">State 3</option>
</select>

<div id="state1">state 1</div>
<div id="state2">state 2</div>
<div id="state3">state 3</div>


$("select").on("change", function() {
   var v = $(this).val();
    $("div").hide();
    $("div#" + v).show();
});

div {
    display: none;
}