Question

我想知道是否可以将一段文字“转换”成一个链接。

例如：

我有一个包含文字的标签：“通过接受我们的条款和条件，您将能够访问调查（阅读更多内容）”

我希望阅读更多成为一个链接，以便它可以点击。这可能在标签（或文本字段）中吗？

提前致谢。

Answer 1

您可以在标签内执行此操作，但不能在输入字段中执行此操作。

<form>
  <label for="textbox">By accepting our terms and conditions you will be able to access the survey <a href="http://www.mylink.com">(Read More)</a></label>
  <input type="text" name="textbox"/>
</form>

Answer 2

您可以捕获标签内的html并对其进行转换。在其他人发表评论时，您可以针对label进行评论，但不能在文字input字段中进行评论。

假设你的前端有jquery，那就是这样......

let h = $('label#your-id").html();
h = h.replace('(Read More)','<a href="#">(Read More)</a>');
$('label#your-id').html(h);

或者如果您想在所有label

中执行此操作

$('label').each( (i,l) => {
  let h = $(l).html();
  h = h.replace('(Read More)','<a href="#">(Read More)</a>');
  $(l).html(h);
});

Answer 3

由于您已经在使用UI5框架，因此您可以使用支持sap.m.FormattedText或sap.m.MessageStrip等文本中enableFormattedText等文字链接的可用控件。

演示

＆＃13;

sap.ui.getCore().attachInit(() => sap.ui.require([
  "sap/m/FormattedText",
  "sap/m/MessageStrip",
], function(FormattedText, MessageStrip) {
  new FormattedText({
    htmlText: getFormattedText()
  }).addStyleClass("sapUiTinyMargin").placeAt("content");
  new MessageStrip({
    enableFormattedText: true,
    showIcon: true,
    text: getFormattedText(),
  }).addStyleClass("sapUiTinyMargin").placeAt("content");
  function getFormattedText() {
    return `By accepting our terms and conditions you will be able to access the survey <a href="https://example.com" target="_self">(Read More)</a>`;
  }
}));

＆＃13;

<script>
  window["sap-ui-config"] = {
    libs: "sap.m, sap.ui.core",
    preload: "async",
    theme: "sap_belize",
    compatVersion: "edge",
    "xx-waitForTheme": true,
    "xx-async": true,
  }
</script>
<script id="sap-ui-bootstrap" src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"></script>
<body id="content" class="sapUiBody sapUiSizeCompact"></body>

＆＃13;

Answer 4

处理这类情景的最佳方法是使用Message Strip。只需添加：

<MessageStrip id="idMessageStrip" enableFormattedText="true" showIcon="true" showCloseButton="true" class="sapUiMediumMarginBottom">
<link>
    <Link text="Text to be displayed as link goes here" press="handleLinkClick"/>
</link>
</MessageStrip>

如何将一段文本转换为链接？

4 个答案:

演示