ToBad
Member | Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Есть ещё textarea где я пытаюсь поменять текст. Выглядит как поле с текстом, вверху описание "Discription", внизу кол-во набранных символов и сколько всего можно, в данном примере 14/200:
Код:| <span rel="description-text-input"><div data-react-toolbox="input" class="o_input_theme_input o_Input_Input_input o_EditorDescription_EditorDescription_description"><textarea class="o_input_theme_inputElement o_Input_Input_inputElement o_input_theme_filled o_Input_Input_filled" role="input" name="description" type="text" rows="1" style="height: 30px;">test test test</textarea><span class="o_input_theme_bar o_Input_Input_bar"></span><label class="o_input_theme_label o_Input_Input_label"><!-- react-text: 4632 -->Description<!-- /react-text --></label><span class="o_input_theme_counter o_Input_Input_counter"><!-- react-text: 4634 -->14<!-- /react-text --><!-- react-text: 4635 -->/<!-- /react-text --><!-- react-text: 4636 -->200<!-- /react-text --></span></div></span> |
Нахожу его и меняю так:
Код: var txt=$('#content-editor > div > aside > div > div:nth-child(2) > span:nth-child(1) > div > textarea');
txt.value='new'; txt.defaultValue='new'; txt.innerText='new'; txt.innerHTML='new'; txt.textContent='new'; |
Визуально всё меняется, но не счётчик символов. При физическом клике мышкой - возвращается старый текст. Отправка событий мыши: click, mouseup, mousedown, mouseover - подобного не делает. Отправлял полю focus, blur, change - не помогло, ровно как и имитация нажатия символа (символ не добавляется), события keydown, keyup, keypress - пробовал.
Что интересно если переписать код подобным образом:
Код: var txt=$('#content-editor > div > aside > div > div:nth-child(2) > span:nth-child(1) > div > textarea');
setTimeout(function(){txt.value='new'; txt.defaultValue='new'; txt.innerText='new'; txt.innerHTML='new'; txt.textContent='new';},3000); |
Это позволит зайти в поле до изменения текста, дождаться изменения, физической мышкой и клавиатурой проверить что вызывает пересчёт символов. Скажу сразу, потеря фокуса ведёт к восстановлению старого текста, нажатия кнопок мыши не помогает, передвижение курсора стрелками с клавиатуры и клавиши типа shift, ctlr - не помогают, только то помогает, что выводит символ и что очень интересно комбинация ctrl-Z. Последняя не делает undo, но счётчик символов срабатывает.
Из всего вышесказанного делаю вывод, что пересчёт символов и смена текста возможно происходят по событию текстового поля onchange, но у меня не получается вызвать его из кода... Что можно попытаться сделать?
p.s. Ставлю на текстовом поле точку остановки (subtree modifications) и выкидывает часто на этом коде:
Код: function(module, exports, __webpack_require__) {
"use strict";
function forceUpdateIfMounted() {
this._rootNodeID && ReactDOMTextarea.updateWrapper(this)
}
function _handleChange(event) {
var props = this._currentElement.props,
returnValue = LinkedValueUtils.executeOnChange(props, event);
return ReactUpdates.asap(forceUpdateIfMounted, this), returnValue
}
var _prodInvariant = __webpack_require__( /*! ./reactProdInvariant */ 8),
_assign = __webpack_require__( /*! object-assign */ 12),
LinkedValueUtils = __webpack_require__( /*! ./LinkedValueUtils */ 259),
ReactDOMComponentTree = __webpack_require__( /*! ./ReactDOMComponentTree */ 16),
ReactUpdates = __webpack_require__( /*! ./ReactUpdates */ 43),
ReactDOMTextarea = (__webpack_require__( /*! fbjs/lib/invariant */ 2), __webpack_require__( /*! fbjs/lib/warning */ 5), {
getHostProps: function(inst, props) {
return null != props.dangerouslySetInnerHTML && _prodInvariant("91"), _assign({}, props, {
value: void 0,
defaultValue: void 0,
children: "" + inst._wrapperState.initialValue,
onChange: inst._wrapperState.onChange
})
},
mountWrapper: function(inst, props) {
var value = LinkedValueUtils.getValue(props),
initialValue = value;
if (null == value) {
var defaultValue = props.defaultValue,
children = props.children;
null != children && (null != defaultValue && _prodInvariant("92"), Array.isArray(children) && (children.length <= 1 || _prodInvariant("93"), children = children[0]), defaultValue = "" + children), null == defaultValue && (defaultValue = ""), initialValue = defaultValue
}
inst._wrapperState = {
initialValue: "" + initialValue,
listeners: null,
onChange: _handleChange.bind(inst)
}
},
updateWrapper: function(inst) {
var props = inst._currentElement.props,
node = ReactDOMComponentTree.getNodeFromInstance(inst),
value = LinkedValueUtils.getValue(props);
if (null != value) {
var newValue = "" + value;
newValue !== node.value && (node.value = newValue), null == props.defaultValue && (node.defaultValue = newValue)
}
null != props.defaultValue && (node.defaultValue = props.defaultValue)
},
postMountWrapper: function(inst) {
var node = ReactDOMComponentTree.getNodeFromInstance(inst),
textContent = node.textContent;
textContent === inst._wrapperState.initialValue && (node.value = textContent)
}
});
module.exports = ReactDOMTextarea
}, /*!**************************************************!*\ |
и в конце на этом:
Код: function(module, exports, __webpack_require__) {
"use strict";
function getNodeAfter(parentNode, node) {
return Array.isArray(node) && (node = node[1]), node ? node.nextSibling : parentNode.firstChild
}
function insertLazyTreeChildAt(parentNode, childTree, referenceNode) {
DOMLazyTree.insertTreeBefore(parentNode, childTree, referenceNode)
}
function moveChild(parentNode, childNode, referenceNode) {
Array.isArray(childNode) ? moveDelimitedText(parentNode, childNode[0], childNode[1], referenceNode) : insertChildAt(parentNode, childNode, referenceNode)
}
function removeChild(parentNode, childNode) {
if (Array.isArray(childNode)) {
var closingComment = childNode[1];
childNode = childNode[0], removeDelimitedText(parentNode, childNode, closingComment), parentNode.removeChild(closingComment)
}
parentNode.removeChild(childNode)
}
function moveDelimitedText(parentNode, openingComment, closingComment, referenceNode) {
for (var node = openingComment;;) {
var nextNode = node.nextSibling;
if (insertChildAt(parentNode, node, referenceNode), node === closingComment) break;
node = nextNode
}
}
function removeDelimitedText(parentNode, startNode, closingComment) {
for (;;) {
var node = startNode.nextSibling;
if (node === closingComment) break;
parentNode.removeChild(node)
}
}
function replaceDelimitedText(openingComment, closingComment, stringText) {
var parentNode = openingComment.parentNode,
nodeAfterComment = openingComment.nextSibling;
nodeAfterComment === closingComment ? stringText && insertChildAt(parentNode, document.createTextNode(stringText), nodeAfterComment) : stringText ? (setTextContent(nodeAfterComment, stringText), removeDelimitedText(parentNode, nodeAfterComment, closingComment)) : removeDelimitedText(parentNode, openingComment, closingComment)
}
var DOMLazyTree = __webpack_require__( /*! ./DOMLazyTree */ 101),
Danger = __webpack_require__( /*! ./Danger */ 1196),
createMicrosoftUnsafeLocalFunction = (__webpack_require__( /*! ./ReactDOMComponentTree */ 16), __webpack_require__( /*! ./ReactInstrumentation */ 37), __webpack_require__( /*! ./createMicrosoftUnsafeLocalFunction */ 263)),
setInnerHTML = __webpack_require__( /*! ./setInnerHTML */ 175),
setTextContent = __webpack_require__( /*! ./setTextContent */ 527),
insertChildAt = createMicrosoftUnsafeLocalFunction(function(parentNode, childNode, referenceNode) {
parentNode.insertBefore(childNode, referenceNode)
}),
dangerouslyReplaceNodeWithMarkup = Danger.dangerouslyReplaceNodeWithMarkup,
DOMChildrenOperations = {
dangerouslyReplaceNodeWithMarkup: dangerouslyReplaceNodeWithMarkup,
replaceDelimitedText: replaceDelimitedText,
processUpdates: function(parentNode, updates) {
for (var k = 0; k < updates.length; k++) {
var update = updates[k];
switch (update.type) {
case "INSERT_MARKUP":
insertLazyTreeChildAt(parentNode, update.content, getNodeAfter(parentNode, update.afterNode));
break;
case "MOVE_EXISTING":
moveChild(parentNode, update.fromNode, getNodeAfter(parentNode, update.afterNode));
break;
case "SET_MARKUP":
setInnerHTML(parentNode, update.content);
break;
case "TEXT_CONTENT":
setTextContent(parentNode, update.content);
break;
case "REMOVE_NODE":
removeChild(parentNode, update.fromNode)
}
}
}
};
module.exports = DOMChildrenOperations
},
/*!******************************************!*\
(node.defaultValue=props.defaultValue)},postMountWrapper:function(inst){var node=ReactDOMComponentTree.getNodeFromInstance(inst),textContent=node.textContent;textContent===inst._wrapperState.initialValue&&(node.value=textContent)}});module.exports=ReactDOMTextarea},/*!**************************************************!*\ |
|
Всего записей: 270 | Зарегистр. 22-11-2006 | Отправлено: 02:22 08-11-2017 | Исправлено: ToBad, 02:36 08-11-2017 |
|
