伙计们,我正在研究react js
我已经创建了一个输入文本,并且在该输入按钮模糊时我正在调用一个方法并更新状态变量
但似乎如果我使用 on Blur 而不是 onChange 那么输入文本将变为只读字段
<!DOCTYPE html>
<html>
<head>
<script data-require="react@*" data-semver="0.13.3" src="http://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.js"></script>
<script data-require="react-jsx@*" data-semver="0.13.1" src="http://cdnjs.cloudflare.com/ajax/libs/react/0.13.1/JSXTransformer.js"></script>
<link rel="stylesheet" href="style.css" />
<script type="text/jsx">
var App = React.createClass({
getInitialState: function () {
return {value: 'Hello!'};
},
changeTo: function (e) {
this.setState({value: e.target.value});
},
render: function () {
return (
<div>{this.state.value}
<input type="text" defaultValue={this.state.value || ''}
value={this.state.value} onBlur={(e) => this.changeTo(e)} />
</div>
);
}
});
React.render(
<App />,
document.getElementById('app')
);
</script>
</head>
<body>
<div id="app"></div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud) 我正在尝试实现表体可滚动。我能够成功做到这一点,但现在我面临宽度 100% 的问题
请检查这个jsfiddle https://jsfiddle.net/Ratan_Paul/stpgd6x6/
<table>
<thead style="display:block;">
<tr>
<th>Company</th>
<th>Contact</th>
<th>Country</th>
</tr>
</thead>
<tbody style="max-height: 50px;display: block;overflow-y:auto;">
<tr>
<td>Alfreds Futterkiste</td>
<td>Maria Anders</td>
<td>Germany</td>
</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Francisco Chang</td>
<td>Mexico</td>
</tr>
<tr>
<td>Ernst Handel</td>
<td>Roland Mendel</td>
<td>Austria</td>
</tr>
<tr>
<td>Island Trading</td>
<td>Helen Bennett</td>
<td>UK</td>
</tr>
<tr>
<td>Laughing Bacchus Winecellars</td>
<td>Yoshi Tannamuri</td>
<td>Canada</td>
</tr>
<tr>
<td>Magazzini Alimentari Riuniti</td>
<td>Giovanni Rovelli</td>
<td>Italy</td>
</tr>
</tbody>
</table>Run Code Online (Sandbox Code Playgroud)
我不能将宽度应用于 thead 和 tbody 吗?任何解决方案,以便我可以使用滚动并将宽度设置为 100%
我有 2 个用于用户名和密码的输入文本框。还有一个选择列表以获取某些价值。现在我希望用户添加这些值,并且我正在尝试使用 chrome 存储 API 保存这些值。
现在,每次我将变量存储为添加了多少条记录时,如计数器。用于存储我只是这样使用
var skillsSelect = document.getElementById("orgTypeId");
var selectedOrgType = skillsSelect.options[skillsSelect.selectedIndex].value;
var countTotalRecords = totalRecordsVal +1;
var username = 'username'+countTotalRecords;
var password = 'password'+countTotalRecords;
var orgType = 'orgType'+countTotalRecords;
chrome.storage.sync.set({
username: $("#usernameid").val(),
password: $("#passwordid").val(),
orgType: selectedOrgType,
'totalRecords':countTotalRecords
}, function(){
alert('Success!');
});
Run Code Online (Sandbox Code Playgroud)
并且为了检索我正在尝试这样
var getItems = [];
for(var i = 1; i <10; i++){
var username = 'username'+i;
var password = 'password'+i;
var orgType = 'orgType'+i;
getItems.push(username);
getItems.push(password);
getItems.push(orgType);
}
console.log('==========getItems======',getItems);
chrome.storage.sync.get(getItems, function(items){
var keys = Object.keys(items); …Run Code Online (Sandbox Code Playgroud)