第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

在點擊事件中獲取div的value屬性

在點擊事件中獲取div的value屬性

慕森卡 2023-11-02 21:29:52
我的目標(biāo)是獲取 div 的 value 和 id 屬性。id 正在工作,但我無法獲得工作的值。我已經(jīng)嘗試過event.target.value,但它仍然返回未定義。我應(yīng)該單獨傳遞該屬性還是將其附加到event?// hooksconst {useState} = React;const OPTIONS =  [        {id: 0, value: '00:00', display: 'Midnight', period: null},        {id: 1, value: '00:30', display: '12:30', period: 'AM'},        {id: 2, value: '01:00', display: '1:00', period: 'AM'},        {id: 3, value: '01:30', display: '1:30', period: 'AM'},        {id: 4, value: '02:00', display: '2:00', period: 'AM'},        {id: 5, value: '02:30', display: '2:30', period: 'AM'},        {id: 6, value: '03:00', display: '3:00', period: 'AM'},        {id: 7, value: '03:30', display: '3:30', period: 'AM'},        {id: 8, value: '04:00', display: '4:00', period: 'AM'},        {id: 9, value: '04:30', display: '4:30', period: 'AM'},        {id: 10, value: '05:00', display: '5:00', period: 'AM'},        {id: 11, value: '05:30', display: '5:30', period: 'AM'},        {id: 12, value: '06:00', display: '6:30', period: 'AM'},    ]function TimeInput(props){    function handleClick(event, value){      console.log(event.target.value)      props.onClick(Number(event.target.id), value);    };    const timeMarkup = OPTIONS.map(option =>       <div         className={ props.value === option.id ? 'button selected' : 'button' }        id={option.id}        value={option.value}        onClick={(e, value) => handleClick(e, value)}      >          {option.display} {option.period}      </div>    );    return (        <div className='time-container'>{timeMarkup}</div>    );};function App(){  const [selectedId, setSelectedId] = useState('');  const [value, setValue] = useState('');  function handleClick(id, value){    setSelectedId(id);    setValue(value)  }  return (    <div>      <p>Id: {selectedId} Value: {value}</p>      <TimeInput value={selectedId} onClick={handleClick}/>    </div>  );};// RenderReactDOM.render(  <App />,  document.getElementById("react"));
查看完整描述

2 回答

?
慕田峪7331174

TA貢獻1828條經(jīng)驗 獲得超13個贊

div 沒有 value 屬性。您可能可以使用 getAttribute 檢索它,但有一個更簡單的解決方案。更改value={option.value} onClick={(e, value) => handleClick(e, value)}onClick={(e) => handleClick(e, option.value)}

另一方面,出于可訪問性的原因,您不應(yīng)該制作可點擊的 div。您應(yīng)該使用樣式按鈕或錨標(biāo)記。至少將 aria 屬性 role="button" 添加到 div 中。


查看完整回答
反對 回復(fù) 2023-11-02
?
紅顏莎娜

TA貢獻1842條經(jīng)驗 獲得超13個贊

將點擊事件更改為:

onClick={(e, value) => handleClick(e, option.value)}


查看完整回答
反對 回復(fù) 2023-11-02
  • 2 回答
  • 0 關(guān)注
  • 217 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號