可以通过以下步骤实现:
<select id="myDropdown">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3">Option 3</option>
</select>
const CosmosClient = require("@azure/cosmos").CosmosClient;
const endpoint = "<Cosmos DB endpoint>";
const key = "<Cosmos DB key>";
const databaseId = "<Cosmos DB database ID>";
const containerId = "<Cosmos DB container ID>";
const client = new CosmosClient({ endpoint, key });
async function addItemToCosmosDB(item) {
const database = client.database(databaseId);
const container = database.container(containerId);
const { resource: createdItem } = await container.items.create(item);
console.log(`Created item with id: ${createdItem.id}`);
}
const dropdown = document.getElementById("myDropdown");
dropdown.addEventListener("change", (event) => {
const selectedItem = event.target.value;
addItemToCosmosDB({ value: selectedItem });
});
在上述代码中,需要替换<Cosmos DB endpoint>
、<Cosmos DB key>
、<Cosmos DB database ID>
和<Cosmos DB container ID>
为实际的Cosmos DB连接信息。
通过以上步骤,你可以将HTML下拉列表连接到Cosmos DB,并实现将选项值存储到数据库中的功能。这样可以方便地管理和查询下拉列表的选项数据。
领取专属 10元无门槛券
手把手带您无忧上云